Code Style Assistance in CSS

Last modified: 21 July 2022

tip

Your code style preferences are saved using the mechanism of layer-based settings. Among other things, this mechanism allows you to maintain different preferences for different solutions as well as to keep these preferences under a VCS and automatically share them with your team members.

ReSharper provides the following code style assistance features in CSS:

Managing and applying code formatting rules

An important aspect of code style is how to format the code, that is, how to use whitespaces, tabs, and line breaks to arrange code elements, whether and how to use tabs for indents, whether and how to wrap long lines, and so on.

The extensive set of ReSharper code formatting rules has a default configuration that takes into account default Visual Studio formatting options as well as numerous best practices. You can configure every detail of formatting rules and enforce the rules in your code. These rules are applied when ReSharper produces new code with code completion and code generation features, applies code templates and performs refactorings. The formatting rules can also be applied to the existing code in the current selection, current file, or in a larger scope up to the entire solution.

ReSharper stores formatting preferences using the mechanism of shared settings. You can configure formatting rules in options pages under the Code Editing | C++ | Formatting Style group. You can also store and share formatting settings in the EditorConfig files.

Alphabetizing properties

ReSharper allows you to sort properties alphabetically within selector declarations. You can alphabetize properties using code cleanup with the Built-in: Full cleanup profile or with a custom profile where the Alphabetize properties option is selected in the CSS category.

Applying code cleanup

Consider the example below:

ReSharper: Code cleanup in CSS
After applying code cleanup with the profile Built-in: Full cleanup and default settings, declarations are split with line breaks; if a declaration contains several properties, they are placed on separate lines and sorted alphabetically; if there is only one, then - on the same line, etc:

ReSharper: Code cleanup in CSS

See also

Procedures