Live data from Hacker News

State of CSS

web.dev

191–200 of 234 posts

Re: State of CSS

#191
post #66

:has() basically removes the need for us to use JS to attach classes to parent elements as we can essentially look ahead now, e.g. ".some-component:has(.input-select-all:checked) { background: blue }" whereas we would have to use JS to query the input, then query the parent and attach some css class as a styling hook. Container queries will allow us to fine-tune the not-so-predictable gaps between our predictable bre…

I was curious about current browser compatibility for :has().

The major browsers (Chrome, Edge, Safari, Opera) support it except for Firefox, which has it behind a flag still. ~76% of users are covered.

:has() CSS relational pseudo-class - https://caniuse.com/css-has

Re: State of CSS

#192

Earlier quoted context omitted.

When it comes to CSS Safari is rarely behind, and often ahead. When it comes to Chrome-only non-standards Safari is right where it needs to be: not implementing this bullshit.

Safari is so behind in terms of lack of support for free media formats/codecs like webm, webp, and av1. You can't even switch browsers to view them, since it's all webkit

> support for free media formats/codecs like webm, webp, and av1.

You mean codecs developed exclusively by Google (often in rapid succession) and which Google aggressively pushes by abusing its dominant position https://www.protocol.com/youtube-tv-roku-issues

Re: State of CSS

#193

Earlier quoted context omitted.

When it comes to CSS Safari is rarely behind, and often ahead. When it comes to Chrome-only non-standards Safari is right where it needs to be: not implementing this bullshit.

I mostly agree, but mobile Safari seems intentionally behind on PWAs, and I do blame Apple's obvious conflict of interest with the App Store. Biggest thing is lack of support for notifications, though supposedly that's finally changing after years: https://www.searchenginejournal.com/web-push-coming-to-ios/4...

> mobile Safari seems intentionally behind on PWAs

There's no such thing as a PWA. There are a dozen disparate standards, and everyone has their own idea which collection of standards constitutes a PWA.

Mobile Safari supports the absolute vast majority of those standards.

IIRC the only "major" standard from that bunch that mobile Safari didn't support was push notifications.

Re: State of CSS

#194

Earlier quoted context omitted.

When it comes to CSS Safari is rarely behind, and often ahead. When it comes to Chrome-only non-standards Safari is right where it needs to be: not implementing this bullshit.

Thank you for calling this out. I feel like there is a psyops campaign paid for by Google denouncing any organization/tech that doesn't blindly follow their non-standard standards.

Google has a very large share of developers' minds.

They have a large network of "developer advocates" whose only job is to promote Google and Chrome under the guise of promoting web standards. And, of course, these "web advocates" will often go out of their way to vilify other browsers.

They own web.dev where they push out propaganda pieces and present their own work as fait accompli often without as much as mentioning that no, these are not standards.

Coupled with the fact that Chrome is actually the most dev-friendly browser, and you have huge swaths of dev community lapping up whatever Chrome throws over the wall without a single second thought.

Re: State of CSS

#195

Earlier quoted context omitted.

When it comes to CSS Safari is rarely behind, and often ahead. When it comes to Chrome-only non-standards Safari is right where it needs to be: not implementing this bullshit.

I was testing my app on safari about a year ago, at the time even a simple property like transform required webkit vendor prefix.

Safari hasn't required a prefix since version 9 (except for the backface-visibility property which I personally never heard of) https://caniuse.com/?search=transform

Last release of version 9 was in 2016, 6 years ago.

Re: State of CSS

#196
Nobody seems to have mentioned the (planned) advances for gradients. I love gradients and have had a lot of fun implementing them (beyond what the 2d canvas API offers) in my JS canvas library[1]

> Gradients can't be animated though. They are too flexible and too complex for the browser to "just derive" how you want them to animate.

Animating gradients can be joyful work (with obvious caveats that such animations need to respect accessibility concerns eg prefers-reduced-motion). I assume that CSS gradient animation is difficult because of the way gradients, and animations, get defined in the stylesheet?

[1] - linear gradient demo - https://scrawl-v8.rikweb.org.uk/demo/canvas-003.html

Re: State of CSS

#197
I have the sentiment that CSS is now too bloated. It could be nice to obsolete some feature. A kind of edition could be pleasant : to get new features you have to opt out some old obsolete features. This also allows fixing known issues by breaking backward compatibility. For instance:

`@edition(2023)` could make `box-sizing: border-box` the default

Re: State of CSS

#198
post #143

Earlier quoted context omitted.

It's so annoying to me that there's one browser that's holding everyone back. They also make it so that no one can use anything but their browser engine on mobile phones so they're harder to ignore.

This is repeated over and over again, but, it’s not true when it comes to Safari’s support for CSS. Now, requiring a Mac to debug JS on mobile Safari.. That’s irritating.

[deleted]

Re: State of CSS

#199
post #143
post #138

It's so interesting, these waves of CSS improvements. Before the flexbox/grid arrival, there were years of near-zero progress. The flexbox/grid release, uniquely coordinated across browsers (for once), was an excellent milestone, but not really a movement. These last 2 years though feel almost like a revolution in comparison to CSS's history. Somebody is pushing very hard. These are some very serious improvements tha…

It's so annoying to me that there's one browser that's holding everyone back. They also make it so that no one can use anything but their browser engine on mobile phones so they're harder to ignore.

also Safari dev tools are pure garbage, the worst i've used since IE 10. constantly crashes for no reason, refuses to select elements unless you close and re-open it, a weirdly stubborn cache, just so much worse than the chromium/firefox devtools. debugging in Safari is a major pain in the ass.

and of all the browsers, Safari is the one that tends to render differently from others in a unwanted way. working with dozens of written languages, the ways it f~ks up text rendering and copy wrapping is sometimes baffling too.

and this is without talking about the weird UI, sometimes I try updating a URL and the cursor just starts deleting characters from the wrong place. it's so annoying. and a lack of status bar, unless you manually enable it. what a piece of sh~t browser.

Post reply on HN