CSS Normal Flow Layout

CSS Normal Flow Layout — Understand block and inline layout, the foundation of CSS document flow. The guide walks through Block & Inline, Common Breakpoints, Feature Queries, 2D Transforms, Transition Properties, Keyframes & Animation. Block: div, p, h1-h6, section — width:100% of parent, line breaks before/after, respect width/height. Inline: span, a, strong, em — flow with text, ignore width/height. Inline-block: flows inline but respects width/height. None: element invisible and removed from flow. Mobile: `@media(max-width:639px)` — phones. Tablet: `@media(min-width:640px) and (max-width:1023px)` — portrait/landscape tablets. Desktop: `@media(min-width:1024px)` — laptops. Large: `@media(min-width:1280px)` — wide screens. Mobile-first: use min-width queries (base styles for mobile, add for larger). The guide is organized into 6 sections that build on each other, each pairing a prose explanation with real CSS you can use as-is. Related guides: CSS Introduction, CSS Selectors, CSS Box Model, CSS Flexbox, CSS Grid. This is one of 68 CSS guides on CSS Reference — see the full list on the guides page.