Skill ID: LayingThingsOut_6
Description: Make a section sit in the middle of the screen, with empty space on its left and right.
Where to apply: The main content area of a blog, a login form page.
Key Tailwind Classes:
mx-auto
Gotcha:
mx-auto
only works on elements that are
display: block
(or
flex
,
grid
) AND have a defined width (e.g.,
w-1/2
,
max-w-lg
). It won't center full-width elements or inline elements.