is now part of Shuffle™. The new editor includes templates for Tailwind CSS, Bootstrap, Bulma, and Material-UI.
Switch to Shuffle →
← Tailwind CSS classes list

Tailwind CSS class: .object-contain / .object-*

<div class="bg-gray-300 w-64 m-2 inline-flex justify-center">
    <img class="object-cointain h-24 w-full" src="https://tailwind.build/placeholders/icons/message.svg"/>
</div>

<div class="bg-gray-300 w-64 m-2 inline-flex justify-center">
    <img class="object-cover h-24 w-full" src="https://tailwind.build/placeholders/icons/message.svg"/>
</div>

<div class="bg-gray-300 w-64 m-2 inline-flex justify-center">
    <img class="object-fill h-24 w-full" src="https://tailwind.build/placeholders/icons/message.svg"/>
</div>

<div class="bg-gray-300 w-64 m-2 inline-flex justify-center">
    <img class="object-none h-24 w-full" src="https://tailwind.build/placeholders/icons/message.svg"/>
</div>

<div class="bg-gray-300 w-64 m-2 inline-flex justify-center">
    <img class="object-scale-down h-24 w-full" src="https://tailwind.build/placeholders/icons/message.svg"/>
</div>

Preview

CSS source

.object-contain { object-fit: contain; }
.object-cover { object-fit: cover; }
.object-fill { object-fit: fill; }
.object-none { object-fit: none; }
.object-scale-down { object-fit: scale-down; }

More in Tailwind CSS Positioning