Most probably already know this but it doesn’t hurt to remind and have it down on “paper”. When writing CSS code and as you adjust things to make it all look good in the browser your CSS file becomes huge with extra lines of unneeded code that can be purged to make the size of the file smaller. All though this is not a complete list, this is practical and easy to remember steps that really make a difference. What I am talking about is Shorthand, Default Values and Multiple Declaration.

Shorthand

There are several elements that you can apply shorthand to font, border, background, padding & margin.

font

 Instead of declaring:

font-family:   Arial;
font-size:        12px;
line-height:   18px;
color:              #333;

You can say all that in one sentence:

font: 12px/18px #333 Arial;

border

 Instead of declaring:

border-color:    #ccc;
border-width:    1px;
border-style:      solid;

You can say all that in one sentence:

border: 1px solid #ccc;

background

 Instead of declaring:

background-color:         #fff;
background-image:        url(images/bg.gif);
background-position:    top;
background-repeat:        no-repeat;

You can say all that in one sentence:

background: #fff url(images/bg.gif) top no-repeat;

(more…)