#cssWish `padding` and `box-decoration-break` support on `::selection`.
Generally, a way to control the `::selection` background area.
Because with a lot of fonts, this is outrageously tall & especially narrow. Especially if you want to use a cursive font, the letters spill right out of the `::selection`.
If the `::selection` background is so tall that it overlaps the previous line at a not low at all `line-height` just so it catches all ascenders and descenders, can't it be wide enough too?
#cssWish to be able to do:
[type='radio|checkbox'] {}
instead of:
[type='radio'], [type='checkbox'] {}
#CSS #code #coding #frontend #web #dev #cssSelector #webDevelopment #webDev
#cssWish That we could have a zero count for the number of columns in `repeat()`.
That repeat count is often computed. Let's say I want double the width for selected column k out of n columns:
```
repeat(var(--k), var(--w))
calc(2*var(--w)
repeat(calc(var(--n) - var(--k) - 1), var(--w))
```
#CSS #code #coding #cssGrid #frontend #web #dev #webDev #webDevelopment #cssLayout
#cssWish Length multiplication/ division.
Got a right triangle where a cathetus is 50vw, hypotenuse is R (unknown), other cathetus is R - 2em
R² = (50vw)² + (R - 2em)²
R² = 2500vw² + R² - 4em·R + 4em²
R = (2500vw² + 4em²)/4em
Can kinda go around it making 1em be 3vw, but... 😞
For anyone wondering what this is even for: computing the radius of the radial gradient that creates a bottom arch for a page header.
#CSS #Maths #cssMaths #code #web #dev #webDevelopment #webDev #frontend #coding
Ideal #CSS for an img with spaced out border with gradient from img src palette 👇
But 💔😭
☠️ `src()` isn't supported anywhere
☠️ `attr()` only works as a `content` value now
☠️ `filter()` is Safari-only... where `blur()` now produces image edge semitransparency (recent change)
On `src()` https://www.w3.org/TR/css-values/#funcdef-src
On `attr()` https://github.com/web-platform-tests/interop/issues/521
On `filter` https://iamvdo.me/en/blog/advanced-css-filters#filter
#cssWish #css #filter #cssFilter #code #coding #frontend #webDev #webDevelopment
Wish we had a way to select elements with attribute values that are to be found on a list.
That is, do:
[name='foo'|'bar'|'pow'] {
&, & + [for] { /*styles*/ }
}
Instead of what we need to do now:
[name='foo'], [name='bar'], [name='pow'] {
&, & + [for] { /*styles*/ }
}
#CSS #cssWish #code #coding #frontend #webDev #webDevelopment
#SVG comes with so many cool features, but bringing that power to #CSS is so broken unless you don't need responsivity.
clip-path: path() is an example https://css-tricks.com/unfortunately-clip-path-path-is-still-a-no-go/
Another is when toying with lighting - x,y spotlight position can't use % values, just unitless numbers.
#coding #frontend #svgWish #cssWish #svgFilter #cssFilter #clipping #lighting #svgLighting #svgPath #webDev #webDevelopment #codingFrustrations
#cssWish to be able to specify an interpolation function in gradients. This could be so useful when it comes to creating gradient stripes.
There was some discussion about something like this at one point https://github.com/w3c/csswg-drafts/issues/1332 but... ¯\_(ツ)_/¯
Ana Tudor 🐯