https://github.com/abdallahhemdan/css-nesting

Nesting CSS selectors natively using PostCSS as an experiment for the draft of CSSWG
https://github.com/abdallahhemdan/css-nesting

css csswg nesting-styles postcss postcss-plugin

Last synced: about 1 month ago
JSON representation

Nesting CSS selectors natively using PostCSS as an experiment for the draft of CSSWG

• Host: GitHub
• URL: https://github.com/abdallahhemdan/css-nesting
• Owner: AbdallahHemdan
• Created: 2021-06-18T06:31:05.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-06-18T06:46:49.000Z (over 3 years ago)
• Last Synced: 2024-10-25T14:34:32.930Z (3 months ago)
• Topics: css, csswg, nesting-styles, postcss, postcss-plugin
• Language: HTML
• Homepage: https://hemdan.hashnode.dev/css-nesting
• Size: 5.86 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  

    

  ![Group 87](https://user-images.githubusercontent.com/40190772/122518447-7f147280-d011-11eb-90ea-559421808489.png)


  



# CSS-Nesting

When writing HTML you've probably noticed that it has a clear nested and visual hierarchy. CSS, on the other hand, doesn't SO FAR

If you're not familiar with CSS preprocessors (scripting languages that extend the default capabilities of CSS) like Sass, Less, Stylus, and more. these preprocessors give you the ability to use variables, nest css selectors within selectors, and much more

For a long time, a big reason to use preprocessors like Sass was that it has the ability to use variables but now css has variables too just as that css will soon have nesting as well

Nesting CSS selectors natively in the CSSWG draft and is not available in browsers yet but we will see how to use it today using PostCSS with Vite, check it out from [here in Hashnode](https://hemdan.hashnode.dev/css-nesting)