Live data from Hacker News

CSS Grid Lanes

webkit.org

81–90 of 237 posts

Re: CSS Grid Lanes

#81

Earlier quoted context omitted.

This seems like a bit of a trend with Safari. Around big releases Apple will announce how Safari is the best at X, but other times of the year it gets a lot of flack. I assume this is due to Safari’s more traditional release schedule vs other browsers continuously shipping feature updates.

Cool stuff they're working on tends to take a very long time to reach customers' hands compared to other browsers. Just compare the "stable" and "experimental" graphs on wpt.fyi for Safari. I can't think of a single good reason why they don't adopt an "evergreen" 4/6-week update model except Not Invented Here syndrome or "it's not Apple-like, we prefer the OS team (and therefore Marketing) dictating our release sched…

The web platform doesn’t need to move this fast. Google is, often unilaterally, pushing new features and declaring them standards. In my opinion, the web should not be changing so fast that a truly open source community project couldn’t keep up. I don’t like how the web has become reliant on the largesse of billion dollar corporations.

I recognise that this is a controversial take, but in my opinion what Google is doing is a variant of “embrace and extend”. Traditionally, this meant proprietary extensions (e.g. VBScript) but I think this a subtle variant with similar consequences.

Re: CSS Grid Lanes

#83

Earlier quoted context omitted.

Cool stuff they're working on tends to take a very long time to reach customers' hands compared to other browsers. Just compare the "stable" and "experimental" graphs on wpt.fyi for Safari. I can't think of a single good reason why they don't adopt an "evergreen" 4/6-week update model except Not Invented Here syndrome or "it's not Apple-like, we prefer the OS team (and therefore Marketing) dictating our release sched…

The web platform doesn’t need to move this fast. Google is, often unilaterally, pushing new features and declaring them standards. In my opinion, the web should not be changing so fast that a truly open source community project couldn’t keep up. I don’t like how the web has become reliant on the largesse of billion dollar corporations. I recognise that this is a controversial take, but in my opinion what Google is do…

VBScript is a word I hadn't heard in quite a while! Brings back memories of editing 5k line .asp files to find an if statement and then a 1000 lines of html and such. Sadly, I dont' think web development is actual better 20+ years later, just different...

Re: CSS Grid Lanes

#84

Earlier quoted context omitted.

Fascinating tracker. So we started 2025 with nearly every browser under 80% and ending the year with every browser with >98% interop? That's a lot of amazing work done by a lot of teams. Incredible!

Just to clarify the meaning of the measurement, it doesn't mean they're 98% interoperable across everything, it's across the specific set of goals for 2025. (Which is still really good!) I think they realized that shipping the features out of sync meant nobody could use them until all browsers adopted them, which took years, so now they coordinate

All of the above and even more so to have those features behave identically across the member browsers.

Re: CSS Grid Lanes

#86

I have to ask, like with all the other browser specific trial implementations: how is cross platform support? If we wanted to make a grid layout that only worked in one browser engine, grid-template-rows: masonry was there for a while now. Chromium still seems to be working on support it seems based on https://cr-status.appspot.com/feature/5149560434589696 so maybe it'll be useful soon? That page indicates that they'…

It's been on-and-off in all three browsers behind flags etc, but it's been in a constant state of flux over the last three years. One of the most gnarly new CSS features to get right. Lots of great arguments about how to implement it.

Re: CSS Grid Lanes

#87
post #76

Earlier quoted context omitted.

Masonry layout fixes one of the dimensions. That means either portrait or landscape images will look visibly smaller (less detailed, more ignorable, etc) than those of the inverse aspect ratio, because their longer side must be the same length as the latter’s shorter side. This has real UX consequences. What masonry works best with is images of different aspect ratios but the same orientation.

Pointing out that masonry isn't as good with mixed-orientation content as it is with uniform-orientation content is all well and good, but we still need a way to display mixed orientation content. What alternatives to masonry do you propose? - If you stretch all images into a uniform aspect ratio, they get all squashed and look terrible. - If you crop all images into a uniform aspect ratio, you lose potentially the m…

Well I think this is a great step forward but it would be great if we could mix aspect ratios even better...

Consider a similar layout to OP but the landscape images will span multiple columns as well as everything it already does.

The thing about masonry is that it adapts to the size of the images. You could already do masonry using flexbox if you know the image sizes (https://github.com/hannasm/masonflexjs). Doing it as a true mosaic layout would be a step above current capabilities. At that point it's probably pretty easy to create configurations that don't fit perfectly/ require lots of empty space to layout nicely though.

Re: CSS Grid Lanes

#88
post #59

I've been using Chromium's display: masonry in some internal apps since they introduced it behind a flag in Chromium 140. Looks like they just have to rename it now?

I have too. And the Safari version that was in the betas/tech previews.

One of the biggest arguments over the last couple of years was what to call it. A lot, lot of ideas put forth as alternatives to "masonry" which wasn't thought to be great for non-English speakers. I'm glad they finally nailed a name for it!

The other big argument was over how to activate it. Is it a grid? Is it a flexbox? Is it a brand new animal?

Now I just need to figure out the best way to implement this semantically with a polyfill for the next 30 months until it's baseline.

Re: CSS Grid Lanes

#89
post #64

how does it work with animations? like if i transition:all and then remove a middle img does the other elements get animated?

I guess wire up a codepen demo and try it out. I know the guys writing this were well aware of all the edge cases like that and these are some of the absolute smartest CSS people you can think of who had to write the very detailed spec for this.

I don't think the smooth reflow made it into the current spec, so I guess watch this space?

https://www.w3.org/TR/css-grid-3/

Re: CSS Grid Lanes

#90

Earlier quoted context omitted.

Cool stuff they're working on tends to take a very long time to reach customers' hands compared to other browsers. Just compare the "stable" and "experimental" graphs on wpt.fyi for Safari. I can't think of a single good reason why they don't adopt an "evergreen" 4/6-week update model except Not Invented Here syndrome or "it's not Apple-like, we prefer the OS team (and therefore Marketing) dictating our release sched…

The web platform doesn’t need to move this fast. Google is, often unilaterally, pushing new features and declaring them standards. In my opinion, the web should not be changing so fast that a truly open source community project couldn’t keep up. I don’t like how the web has become reliant on the largesse of billion dollar corporations. I recognise that this is a controversial take, but in my opinion what Google is do…

I know it's fashionable to forcefully shove the same pet peeves about Chromium into any topic even loosely related, but here I'm talking about Safari webcompat fixes, bug fixes, and improvements having very long delays between being written and landing in customers' hands. I would make the same argument if Chrome never existed. Thank you for presenting the 10,001st reissue of this "controversial take".
Post reply on HN