ProCSSor is a powerful (and wholly free) CSS prettifier that lets you format CSS in the exact way you want. It empowers you to turn your CSS into something that is visually more compelling, and with a minimum of effort at that.
How to Use? Under the Options pane, mouse-over each select dropdown and checkbox to activate informational tooltips.
- On Separate Lines if > 1 (Default): Does not put the (opening and closing) braces on newline, if a rule contains only a single declaration, regardless of the Brace Style selected.
- On Separate Lines: Formats all rules, including rules with only a single declaration, according to the selected Brace Style.
- Same Line: Popularly known as Single-Line Formatting. It puts selector(s) of a rule, brackets, and attribute/value pairs all on the same line.
- Alphabetically (a-z)
- Alphabetically (z-a)
- Length (Ascending)
- Length (Descending)
Styles comments found with:
- UPPERCASE Text — where all letters are capital letters.
- Capitalized Text — where first letter is a majuscule (upper-case) and the remaining letters are minuscules (lower-case).
Separates selectors and declarations into
two virtual columns:
Selectors can be left
Indents child and sibling selectors. Upto 4 levels, with a tab or space.
Groups similar attribute/value pairs
together (same line) for easy editing.
Performs Safe Formatting.
Uncheck this to enable Sort Properties and Group features.
But be warned, unchecking this might (but not necessarily will) break something.