Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>CSS Property SorterNew to Visual Studio Code? Get it now.

CSS Property Sorter

Enzo Mourany

|
45 installs
| (2) | Free
vscode extension that allows to sort css properties in a logical and consistent order
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Icon

CSS Property Sorter

Description

This extension allows you to sort the CSS properties of each selector in a CSS file. It makes the code more readable and facilitates maintenance.

There is an ordering standard for css properties that is not well respected. This extension allows you to automatically order all these properties.

Installation

  1. Open the extensions panel in VS Code
  2. Search for CSS Property Sorter
  3. Click Install

Usage

  1. Open a CSS (or SASS, SCSS, LESS) file

  2. Click on the CSS Sort button in the status bar

Status Bar Button

or tap Ctrl+Shift+P and type CSS Sort

Command Palette
  1. Click on run in the notification that appears
Notification Run Button
  1. The properties are now sorted !
Selector Before Sort Selector After Sort

Configuration

The extension uses the following sorting standard :

  • flexbox properties
  • grid properties
  • positionning properties
  • visibility properties
  • cliping properties
  • box properties
  • animation properties
  • background properties
  • border properties
  • typography properties

License

MIT License

Author

Enzo Mourany

Contributing

Contributions, issues and feature requests are welcome!

Show your support

Give a ⭐️ if this project helped you!

  • Contact us
  • Jobs
  • Privacy
  • Terms of use
  • Trademarks
© 2023 Microsoft