Shorthand CSS: Easier to learn, read and update!
Well, I’m slowly getting through all my bookmarks, blogging the important sites I’ve discovered over the last couple of years.
I’ve found another gem..
If you write CSS then you will be aware how bulky it can become and, more importantly, difficult to read. Using shorthand CSS you can cut through a lot of the bulk by removing excessive property declarations and with a quick scan you can find a property to change or update.
Roger Johansson over at www.456bereastreet.com has written a good post about the most common forms of shorthand.
A summary of efficient css with shorthand properties
Typically they combine many declarations into one single declaration. The most important thing to remember from these findings is the order of the attributes within the new longer declaration!
One other thing is worth mentioning again.. if you are setting a value to zero or 0 you don’t need to add the measurement on the end (it is px by default).
For example:
Margin:0;
is the same as
Margin:0px;
and finally, this is purely my own habit, when setting margin or padding i always use..
Margin:0 0 0 0; Padding:0 0 0 0;
..even if i just want to change one value. It saves typing, keeps things neat and if you do need to go back and alter something you have already included it so you just change the value!