Ciao, CSS preprocessors?
CSS Nesting is here, folks.

https://codepen.io/art-eque/pen/zxBOyry?editors=0100

#CSSNesting #ModernCSS #CSSFeatures #CSSTips #CSSTricks #NoMorePreprocessors #GoodbyeSass #DevTrends #WebStandards

I have a project where I can now use CSS Nesting in production and oh, it makes so many things nicer!

There are a lot of cases where you’d normally have to duplicate many class names for child selectors, which can now just be wrapped by one selector.

It also makes the structure of the rules more logical/clearer to read and can help group things together in a CSS file.

The implementers did a great job removing the requirement of nested selectors starting with a symbol, too 👌

#CSS #CSSNesting

#Development #Overviews
Think you know media queries? · “Get ahead of the curve and start putting them to use.” https://ilo.im/1679ci

_____
#MediaQueries #FeatureDetection #Devices #Browser #Accessibility #WebDev #Frontend #CSS #CssNesting

#Development #Launches
CSS Boilerplate · A default CSS structure for projects of any size https://ilo.im/163i67

_____
#Boilerplate #CSS #CssReset #CssNesting #WebPerf #WebDev #Frontend #HTML

#Development #Techniques
Approaches to the ‘&’ selector in CSS · More maintainable, readable, and clever CSS nesting https://ilo.im/1628p2

_____
#ModernCSS #Maintainability #Readability #Ampersand #CssNesting #Framework #WebDev #Frontend #CSS #Sass

#Development #Techniques
Approaches to the ‘&’ selector in CSS · More maintainable, readable, and clever CSS nesting https://ilo.im/1628p2

_____
#ModernCSS #Maintainability #Readability #Ampersand #CssNesting #Framework #WebDev #Frontend #CSS #Sass

#Development #Techniques
Conditional CSS grid template areas · A magic formula to “open the gates to layout heaven.” https://ilo.im/161t0f

_____
#Layout #CssGrid #CssNesting #ContainerQueries #LogicalProperties #ResponsiveDesign #WebDesign #WebDev #Frontend #CSS

#Development #Techniques
Fun with custom cursors · Two ways to change the default cursor appearance https://ilo.im/160i1z

_____
#Cursor #Customization #WebDev #Frontend #CSS #CssCursor #CssNesting #CustomProperties #JavaScript #React