tailwindcss/docs/source/styles/display.md

extends	title
_layouts.markdown	Display

Display

Usage Responsive Customizing

If you're looking for Flexbox utilities, see the Flexbox page.

The display utilities simply display property helpers.

<!-- Using the utilities in HTML: -->

<div class="inline"></div>
<div class="block"></div>
<div class="inline-block"></div>
<div class="hidden"></div>

<div class="table">
    <div class="table-row">
        <div class="table-cell"></div>
    </div>
</div>

Responsive

The display utitlies can also be used with responsive prefixes:

<!-- Using the utilities in HTML: -->

<div class="block sm:inline-block md:block lg:hidden"></div>

// Using the utilities in Less:

div {
  .screen(lg, {
    .inline-block;
  });
}