Skip to main content

Conditional border-radius in CSS (by Ahmad Shadeed via CSS-Tricks)

Visit external resource

Here’s a “media query free” CSS one-liner which lets you set an element to have no border-radius when it is the full width of the viewport, but otherwise to have a border-radius.

It uses the same 9999 multiplication technique as Every Layout do to create a toggle.

Great for Card components which need to be full-width and non-rounded only on narrow viewports.

External Link Bookmark Note Entry Search