Tailwind CSS
/Beginner
Margin
Definition
Utilities for controlling the margin (outer spacing) of an element.
Explain Like I'm New
Personal space. Margin pushes OTHER elements away from you. The Tailwind scale is based on `0.25rem` (4px). So `m-4` is `1rem` (16px), and `m-8` is `2rem` (32px).
Real World Example
Adding `mb-4` (margin-bottom: 1rem) to a paragraph so it doesn't slam into the paragraph below it.
Common Use Cases
- •Pushing elements apart
- •Centering items (`mx-auto`)
Interactive Example
Interview Questions
basic
- What does `mx-auto` do to a block-level element that has a defined width?
intermediate
- What do the `x` and `y` stand for in `my-4` and `mx-4`?