CSS breakpoints via container queries

dascritch / cpu-audio

An audio WebComponent to provide timecoded links and other features to an audio tag

https://dascritch.github.io/cpu-audio/

GNU Lesser General Public License v3.0

24 stars 2 forks source link

Open dascritch opened 5 years ago

dascritch commented 5 years ago

Actually, breakpoints are hard-coded : 640px , 480px, and 320px

CSS variables are not able to be used as breakpoints, as they are... uh... variables.

There are some proposal to the standards, as CSS @element queries and CSS Environment variables, and some tests in browsers.

Wait & see.

dascritch commented 5 years ago

dascritch commented 3 years ago

So we can, but you'll need to dive into themes making.

dascritch commented 2 years ago

Bug re-opened and titlable, as may be do-able via new CSS layers and Container. https://dutchcelt.nl/posts/stop-the-cascade/

dascritch commented 1 year ago

The new @rule @container (inline-size)just got from CSSWG a fantastic improvement : we can use var() !

@container (inline-size > var(--small)) {
}

So now, we can insert it correctly without anty polyfill. Right here, right now, and waits for browsers to implement it !

dascritch commented 1 year ago