Commenting your CSS is important, it is even more important for preprocessors, where you may write some weird-looking things to achieve a specific output or to workaround a preprocessor bug.
It is therefore important to know well the types of comments that are allowed in the different preprocessors.
Additionally, if you decide to use a living style guide you can build one with comments in your preprocessor files. Some good tools to achieve this are Kalei Style Guide, StyleDocco, and Knyle Style Sheets.
Types of comments
| Less | Sass | Stylus | ||||
|---|---|---|---|---|---|---|
| expanded, nested | compact | compressed | expanded | compressed | ||
Single-line comments// foo
|
No | No | No | |||
Block comments/*
|
Yes | Yes | Yes, (output is on a single line) | No | Yes (except if declared in imported .styl file*) | No |
Block comments - alternative/* foo
|
Yes | Yes, (output has star on every line) | Yes, (output is on a single line) | No | Yes (except if declared in imported .styl file*) | No |
Loud block comments/*!
|
Yes | Yes (output keeps the !) | Yes | |||
* You can read more about this behavior of Stylus.