Leading Zeros in CSS Values
published on
Today a question and following a quick conversation about leading zeros in CSS, or rather SASS, popped up, because some pre-processor documentation mentioned that leading zeros are “bad”. Matthew asked and Georgie, who wrote about it in the past, also chimed in.
This kind of wording can be quite misleading, since it doesn’t correctly specify what “bad” refers to. It could be bad practice, bad style, or simply “bad” by personal preference or decision by committee.
Turns out: It doesn’t really matter. It’s not “bad” in general terms and it’s not bad practice, but mainly comes down to which way one prefers. I personally like to include leading zeros, because I find it easier to read.
Whether you like leading zeros or not, when using a linter, you can still decide later on if you want to include zeros in your output file or rather not.
If you worry about the CSS file size, you probably shouldn’t. The savings in file size will in most cases be negligible. You can easily make up for such a small difference by either writing better CSS, or by optimizing other low-hanging-fruit areas like compressing images, etc.
Unless you want to completely geek out on web performance and push the limits of what’s possible, or are in for a 10Kb app challenge, just go with your preferred style, whichever it is, and enjoy writing CSS.