Interview Question

Difference between block and inline elements?

Block boxes form block flow; inline boxes flow within lines.

💡 Concept ✅ Quick Revision 🎨 CSS

Answer

Block and inline boxes participate differently in normal flow. • A block-level box participates in block layout and normally starts on a new line. • An inline-level box participates in inline layout within a line box. • The display property can change generated box behavior without changing HTML meaning.

💡 Simple Example

.badge { display: inline; }
.panel { display: block; }

⚡ Quick Revision

Block boxes form block flow; inline boxes flow within lines.

←

PreviousWhat is display property?

NextWhat is inline-block?

→