Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

CSS Grid – Table layout is back. Be there and be square

developers.google.com

Post reply on HN
Print view View original

261–270 of 280 posts

Re: CSS Grid – Table layout is back. Be there and be square

#261

Post by kalleboo »

diamondlovesyou wrote: post #189
tannhaeuser wrote: post #157

Earlier quoted context omitted.

These things, while beneficial, don't owe their existence to CSS. Instead, introducing eg. CSS shapes or `content: ` (as two extreme examples) was the way of least resistance/guerilla tactics, as opposed to putting the functionality into SVG proper, or aligning the layout box model better with the DOM model, resp. Now what we're left with is a way overcomplicated mess for generations to clean up. There's a reason Moz…

I agree. Most of the HTML I write is to create structure for CSS to use. For example, a `div` is a container, but we put it on the content side. What would have been better would be a flat map identifier -> binary (or string or whatever, your choice) as the content, and then "CSS" (quotes because it wouldn't be the CSS we know now) would declare the layout/look and would read the content map for insertion into placeh…

At one point XSLT was created to convert XML documents into presentation markup. Browsers supported it and everything. It never caught on though.

Re: CSS Grid – Table layout is back. Be there and be square

#262

Post by phkahler »

ashark wrote: post #196
phkahler wrote: post #168

Earlier quoted context omitted.

Next up: Revival of the tag!

I seriously wish it'd survived and been enhanced. Much AJAX in practice is used to replicate the effect of s, but slower, buggier, and with more battery drain.

I agree. My understanding was that it had 2 major problems. 1) you could load other sites or 3rd party content in a frame which caused confusion - browsers should not have allowed that. 2) search engines had problems with them - that's not my problem, they should have gotten smarter. May have been helped by eliminating the first problem.

Re: CSS Grid – Table layout is back. Be there and be square

#263

Post by talmand »

lightedman wrote: post #244
ender7 wrote: post #216

Earlier quoted context omitted.

It's very easy to declaim one or another layout system as verbose or inconsistent. Can you suggest a mainstream layout system that offers this feature in a better manner? I've used a lot of different layout frameworks over the years. Constraint systems are neat but hard to scale. All-code layout definitions are hard to read and reason about. Markup-level layout systems have their issues, but are easier for new progra…

"Can you suggest a mainstream layout system that offers this feature in a better manner" I've done better looking/performing layouts 20 years ago with plain HTML 3.2. CSS is a mess.

Can you provide an example by chance?

Re: CSS Grid – Table layout is back. Be there and be square

#264

Post by talmand »

bshimmin wrote: post #131
tannhaeuser wrote: post #119

I don't know how to say it politely but what has been achieved by using ad-hoc syntax such as this gem (and similar complex CSS syntax): display: grid; grid-template-rows: 150px [nav-start] auto 100px [nav-end]; grid-template-columns: [header-start] minmax(200px, 3fr) 9fr [header-end]; CSS fans for some reason seem to think that its somehow better to have rendering/presentational properties in an ad-hoc language. Ori…

I'm glad someone else said it. I particularly like that they've introduced a new unit, `fr`, and can't even decide what it stands for. I've been writing CSS since about 1996; for some reason, I feel like it all started to go downhill, fast, with the background gradient syntax.

I've always seen it referred to as "fractional". Have you seen it described as something else?

Re: CSS Grid – Table layout is back. Be there and be square

#265

Post by talmand »

matt4077 wrote: post #35

This is excellent. And with the fast pace of browsers, and the improved habits of users (or automatic updates), it should be available for 95%+ of users within a year (It's in the current Safari Technology Preview, so Safari should get it with the next macOS point update). This is also a good moment to remind people that you don't need Bootstrap and the like as much as you used to. Grids were 90% or the reason people…

If you are speaking of people manually inserting style attributes into their code then there's a point for the resistance to that. It's horrible in comparison to classes.

If you are speaking of JS framework dumping code into the style attribute on the fly then there's a smaller point for the resistance to that. There are features of CSS that are not available through the style attribute. Plus, it's just plain inefficient.

Re: CSS Grid – Table layout is back. Be there and be square

#266

Post by talmand »

Vinnl wrote: post #149
matt4077 wrote: post #35

This is excellent. And with the fast pace of browsers, and the improved habits of users (or automatic updates), it should be available for 95%+ of users within a year (It's in the current Safari Technology Preview, so Safari should get it with the next macOS point update). This is also a good moment to remind people that you don't need Bootstrap and the like as much as you used to. Grids were 90% or the reason people…

Also note that every browser that supports grid also supports @supports: https://developer.mozilla.org/en-US/docs/Web/CSS/@supports This means that you can start implementing it today for modern browsers, and then remove the old one once you are ready to ditch old browsers.

Every browser supports @supports. If the browser doesn't know what @supports is, it ignores the entire block.

Re: CSS Grid – Table layout is back. Be there and be square

#267

Post by talmand »

Symbiote wrote: post #205
emodendroket wrote: post #167

Earlier quoted context omitted.

I mean, it is semantic, if you want a table. One of the most baffling things to me is people trying to use not-tables when they're literally trying to display tabular data.

I laughed when I had to make a minor change to an old web application, and found our tabular, scientific data was being displayed in a series of DIV and SPAN elements, with the CSS table styles applied to them. I changed it to a real TABLE, since that's far more accessible -- most users can cut and paste into their spreadsheet, and a screen reader might give options to avoid reading out all the data. Another time, a…

For the purposes of screen readers, it is suggested to use over . What bugs me is the recent usage of as an icon holder.

Re: CSS Grid – Table layout is back. Be there and be square

#268

Post by Symbiote »

scelerat wrote: post #222
Symbiote wrote: post #205

Earlier quoted context omitted.

I laughed when I had to make a minor change to an old web application, and found our tabular, scientific data was being displayed in a series of DIV and SPAN elements, with the CSS table styles applied to them. I changed it to a real TABLE, since that's far more accessible -- most users can cut and paste into their spreadsheet, and a screen reader might give options to avoid reading out all the data. Another time, a…

To be perfectly semantically correct (which he was no doubt attempting, as I is a purely visual/appearance tag, and EM connotes some meaning), he should have used

is the correct element, so if you wish. A taxonomic designation is the first example given in the specification:

"The i element represents a span of text in an alternate voice or mood, or otherwise offset from the normal prose in a manner indicating a different quality of text, such as a taxonomic designation, a technical term, an idiomatic phrase from another language, transliteration, a thought, or a ship name in Western texts."

https://www.w3.org/TR/html5/text-level-semantics.html#the-i-...

Re: CSS Grid – Table layout is back. Be there and be square

#269

Post by Symbiote »

talmand wrote: post #267
Symbiote wrote: post #205

Earlier quoted context omitted.

I laughed when I had to make a minor change to an old web application, and found our tabular, scientific data was being displayed in a series of DIV and SPAN elements, with the CSS table styles applied to them. I changed it to a real TABLE, since that's far more accessible -- most users can cut and paste into their spreadsheet, and a screen reader might give options to avoid reading out all the data. Another time, a…

For the purposes of screen readers, it is suggested to use over . What bugs me is the recent usage of as an icon holder.

See the specification for , a taxonomic designation is the first example of its use.

https://www.w3.org/TR/html5/text-level-semantics.html#the-i-...

Re: CSS Grid – Table layout is back. Be there and be square

#270

Post by Vinnl »

talmand wrote: post #266
Vinnl wrote: post #149

Earlier quoted context omitted.

Also note that every browser that supports grid also supports @supports: https://developer.mozilla.org/en-US/docs/Web/CSS/@supports This means that you can start implementing it today for modern browsers, and then remove the old one once you are ready to ditch old browsers.

Every browser supports @supports. If the browser doesn't know what @supports is, it ignores the entire block.

Actually, if a browser did support grid but not @supports, wrapping your grid in @supports would result in the grid rules not being used.
Post reply on HN