Syntax - Tasty Web Development Treats

900: 13 New CSS Features You Can Start Using Today

105 snips
May 7, 2025
Dive into the latest CSS innovations that can transform web design. Discover the shape function and advanced CSS properties like 'zoom' and 'scale' for better layouts. Learn about custom media queries and how the content visibility property can enhance performance. Hear tips on managing HDMI cables and optimizing device setups, plus amusing anecdotes on input validation frustrations. With fresh features like relative color syntax and advanced text functions, this discussion showcases how modern CSS can simplify development and enhance user experience.
Ask episode
AI Snips
Chapters
Transcript
INSIGHT

CSS Shape() Simplifies Complex Paths

  • The new CSS shape() function offers a CSS-native way to create shapes instead of complicated SVG path strings.
  • It supports all CSS units and variables, making shapes more readable, dynamic, and responsive.
INSIGHT

Zoom Property Scales With Layout

  • The zoom CSS property scales an element and also allows the layout to reflow around the resized element.
  • This contrasts with scale(), which only visually scales without affecting layout.
ADVICE

Consistent Scrollbar Styling Advice

  • Use scrollbar-width and scrollbar-color CSS properties to style scrollbars consistently across browsers.
  • Apply scrollbar-gutter to prevent layout shifts when scrollbars appear or disappear.
Get the Snipd Podcast app to discover more snips from this episode
Get the app