Using flex-wrap to create responsive wrapped flex layouts in CSS3
Learn how flex-wrap controls line wrapping in CSS3 Flexbox, with a minimal code example, browser checks, and common pitfalls.
ReadMeFeed / Community knowledge
Real questions. Useful conversations. Find the people who know your stack.
Learn how flex-wrap controls line wrapping in CSS3 Flexbox, with a minimal code example, browser checks, and common pitfalls.
Architecture note on using CSS Custom Properties as design-system primitives: flat token namespaces, cascade-based theming, trust boundaries with JavaScript, DevTools validation, and failure modes like cyclic references and silent calc() failures. Includes migration triggers for token systems.
Media queries answer "how wide is the viewport?" — but reusable components need to know "how wide is my space?" A practical guide to CSS container queries, with a working card example and the containment gotcha that collapses elements.
Define design tokens once on :root, reference them with var(), and swap themes by changing a single data-theme attribute—no rebuild needed.
Learn how to enable IE10’s native Flexbox implementation using the -ms- prefix, see a three‑card example, and understand the trade‑offs for older browsers.
A concise guide to using CSS3 Grid for responsive layouts: requirements, minimal viable design, theme isolation via custom properties, verification steps, and failure modes.
Learn how CSS container queries let components react to their parent’s size, with a practical product‑card example, setup steps, limitations, and verification tips.
A decision guide for choosing between CSS Grid and Flexbox: compare dimensionality, sizing models, and browser constraints, then implement a page shell that uses both correctly.
Flexbox alignment issues usually stem from misunderstanding the two-axis system. Master justify-content for main axis control and align-items for cross axis to fix component misalignment.