Results for “conditions”
Small, practical examples. Search by task or narrow things down below.
Add a clear boundary in forced-colors mode
CSS: Use a system color for a border when the user’s forced-color mode is active.
CSS✓ Tested
Apply an enhancement only when a feature is supported
CSS: A supports rule preserves the baseline outside browsers that understand the selected declaration.
CSS✓ Tested
Choose an action with switch
Map a small command value to a result.
switch✓ Tested
Choose the smaller of a fixed and viewport-relative size
CSS: Min selects whichever supplied length is smaller at the current viewport.
CSS✓ Tested
Enhance a layout above a minimum viewport width
CSS: A mobile-first min-width query adds columns when enough horizontal space is available.
CSS✓ Tested
Hide interface controls in print layout
CSS: A print media query can retain article content while removing interactive controls.
CSS✓ Tested
Keep a viewport-relative size above a minimum
CSS: Max selects the larger of the candidate lengths.
CSS✓ Tested
Provide a fallback for an unset custom property
CSS: The second var argument supplies a value when the custom property is unavailable.
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
Choose a different image for a small viewport
HTML: Picture evaluates source media conditions before falling back to the img source.
HTML✓ Tested
Match one of several values
Use IN to avoid repeating equality conditions.
IN✓ Tested