Interview Question

How do you center a div?

Use auto inline margins for a sized block or parent layout alignment for both axes.

💡 Concept ✅ Quick Revision 🎨 CSS

Answer

A div can be centered by choosing a method that matches the required axis and layout context. • For horizontal centering of a sized block, auto inline margins can absorb free space. • For two-axis centering, the parent can use Grid or Flexbox alignment. • The container needs available space for the centering to be visible.

💡 Simple Example

.card { width: min(30rem, 100%); margin-inline: auto; }

⚡ Quick Revision

Use auto inline margins for a sized block or parent layout alignment for both axes.