Results for “layout”
Small, practical examples. Search by task or narrow things down below.
Push one flex item away from its siblings
CSS: An auto inline-start margin consumes remaining main-axis space.
CSS✓ Tested
Remove a leading directory while extracting
Linux Commands: Use strip-components only after inspecting a trusted archive layout.
Linux Commands✓ Tested
Reserve space for a visible border
CSS: A border adds to the outer dimensions of a content-box element.
CSS✓ Tested
Respect dark color preference
Apply different CSS colors when the browser requests a dark theme.
CSS✓ Tested
Respect reduced motion
Disable a CSS animation when the user prefers reduced motion.
CSS✓ Tested
Reuse a CSS custom property
CSS: Learn how to reuse a CSS custom property in a complete browser example.
CSS✓ Tested
Reuse colors with custom properties
Define a CSS custom property and use it for text color.
CSS✓ Tested
Rotate a rectangular box around its center
CSS: A ninety-degree transform swaps the visible bounding-box width and height.
CSS✓ Tested
Round a box’s corners
CSS: Border-radius changes the corner shape without changing its rectangular layout dimensions.
CSS✓ Tested
Round a panel’s corners
CSS: Learn how to round a panel’s corners in a complete browser example.
CSS✓ Tested
Scale a value from the root font size
CSS: Rem units follow the document root instead of accumulating through nested font sizes.
CSS✓ Tested
Scale text within limits
Use CSS clamp to bound responsive font sizing.
CSS✓ Tested