TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

What You Need to Know about Modern CSS (Spring 2024 Edition)

131 pointsby fagnerbrackabout 1 year ago

10 comments

exceptioneabout 1 year ago
Some additions are nice, but I have my doubts about where this is going. As usual, Google throws in tons of extra stuff. To compute the size, position and appearance of anything, engines have to deal with a growing list of instructions, that all brings conflict. We had floats, flex, grids, position, and now anchor positioning as well.<p>It strikes me that the more useful additions are implemented by Firefox, and the lesser ones not.<p>I had expected that by now we would have a super light (kernel) spec for SPAs, and the heavier spec for design heavy documents. Chrome cannot keep up with Firefox wrt CSS performance. I don&#x27;t understand why Google is overloading its own camel; the web is not going to render faster with more added complexity.
评论 #40255012 未加载
评论 #40254137 未加载
doixabout 1 year ago
The :has selector is huge if you like customizing sites with grease monkey. You can now modify parents based on their children with pure css. Saves you having to use mutation observers in those cases (assuming the site is built with a React-like thing).
评论 #40250896 未加载
评论 #40251732 未加载
评论 #40251152 未加载
CM30about 1 year ago
Seems like some good stuff there. Personally I really like container queries, cascade layers, nesting and the has selector, all of which feel like they solve some very common design problems in incredibly easy to understand, logical ways.<p>Like cascade layers, nesting and scoped CSS are basically built for component systems, and are going to be so handy for implementing styles for those going forward.<p>Didn&#x27;t know about margin trim either... that sounds like it&#x27;ll be a godsend when it&#x27;s fully implemented. So much extra CSS required to overwrite the margin on the last element in a container almost every time the situation comes up...<p>There&#x27;s some good stuff here for sure.
assimpleaspossiabout 1 year ago
&gt; a list of ... new additions to CSS<p>That should be the real title of the article.<p>Some of those properties are new-ish. If you follow the events, you will have known of them for a while but I agree most people may not be aware of them.
gredabout 1 year ago
I didn&#x27;t realize the nested CSS support level was already so high (80%).<p>CSS nesting looks like a nice quality-of-life improvement in some cases.<p>I&#x27;m not CSS-ninja enough for any of the other items to catch my eye, though the &quot;stylable select element&quot; tease at the end looks interesting.
zeroCaloriesabout 1 year ago
What you need to know about CSS is just enough to get the designs in figma to work on a real page.
评论 #40251200 未加载
baggy_troughabout 1 year ago
Serving nested CSS up without a precompiler is God tier.
评论 #40252500 未加载
评论 #40252667 未加载
morbicerabout 1 year ago
Some nice things (layers, has, scopes) but pleeeasee finally give us the &lt;selectmenu&gt; after 30 years of kludgy pain
codetrotterabout 1 year ago
Their website is giving 504 Gateway Timeout for some attempts, not returning anything for some other attempts, and sometimes does load.
winridabout 1 year ago
Oh nice, nesting. I guess I&#x27;m a bit behind. With nesting and variables I can probably get rid of less in my projects.