Listed out are few best practices that can be followed to write an awesome Stylesheet.

Guideline 1
All CSS properties which are vendor prefixed should be accompained by default property at the end.

  .someRule{
    -webkit-property-name: property_value;
    -moz-property-name: property_value;
    -o-property-name: property_value;
    -ms-property-name: property_value;
    property-name: property_value;            /* Guideline  */
}

Guideline 2
Do not use units when the value is 0.
For example:
padding : 0px can be written as padding : 0.
This might prevent browser from re-computing the value according to the units specified.

  .someRule{
    padding:0            /* Guideline  */
}

Guideline 3
If a Hex-Code of a color contains all the 6 code characters to be the same, then simply truncate it to a 3 coded value.
For example:
color : #000000 can be written as color : #000.

  .someRule{
    color: #999;            /* Guideline  */
    background: #a38990;
}

Guideline 4
Remove CSS properties if it cannot be utilized by the element specified.
There are chances of writing junk code when we develop. But remember to remove the properties remain there if unused.

  .someRule{
    position:static;
    top: 40px;
    left: 30px;
    background: red;
}

In the above code snippet, top and left will not have any impact on the element, as it is positioned static. Removing these unused properites can make your CSS more readable.


429 0 0