Home / Companies / LogRocket / Blog / Post Details
Content Deep Dive

5 new CSS features you can test right now

Blog post from LogRocket

Post Details
Company
Date Published
Author
Anna Monus
Word Count
2,459
Company Posts That Month
75
Language
-
Hacker News Points
-
Post removed?
No
Summary

CSS features undergo significant discussions before being defined by the W3 Consortium and gradually implemented in browsers, with the guide focusing on five testable features: CSS subgrid, Flexbox gaps, content-visibility, contain-intrinsic-size, and the :is and :where pseudo-classes. CSS subgrid enhances grid layout capabilities by allowing grandchildren to adopt a grid's tracks, supported mainly by Firefox 71+ and soon by Chromium-based browsers. Flexbox gaps solve spacing issues between flex items, supported widely except by Safari and Internet Explorer. The content-visibility property, supported by Chrome 85+, Edge 85+, and Opera 71+, improves rendering performance by managing off-screen elements. The contain-intrinsic-size property prevents collapsibility by setting explicit dimensions for elements, supported by Chrome 83+, Edge 83+, and Opera 69+. The :is and :where pseudo-classes simplify CSS selector lists with different specificity levels, where :is is more widely supported. Developers are encouraged to use these features cautiously, considering browser support, while monitoring ongoing CSS developments to facilitate more efficient frontend development.

Trends Found in this Post

No tracked trend matches for this post yet.

Use This Data

Use this post, company, and trend context to find content marketing opportunities, perform competitive analysis, or address product feature gaps via the Plushcap MCP server or the Plushcap API.