css-ninja

6 Habits For Writing Better CSS - Part 1

1. Get into the habit of using a CSS Reset
How many times over and over have you coded your css and testing the code on Firefox and Chrome it looks fantastic and to your surprise IE looks like crap. Something that definitely comes in handy is the CSS Reset.
It just resets all margins,  paddings, sizes etc. and it simplifies knowing that you are working from a clean slate.
You never edit the Reset.css because it must always be the same.

Some important factors when including the Reset css to your html.

-Always load the reset css before your original site css.
-Never edit the reset css, if you edit it, then it has no use of being a reset css.

<link rel="stylesheet" href="reset.css" />
<link rel="stylesheet" href="site.css" /> 

2. Adding comments to your code is very helpful
Have you ever come across a piece of code and had absolutely no idea what it does or for what it is.
Well if the coder didn't add comments then that's just unlucky.

When coding, make it a habit to add comments, so when you are someone else works on the code, they'll have a fair idea of what the code is for.

/* This is a comment for this code section */
.box {
         background: #000;
         color: #999;
}

3. Keeping your code clean
Having clean code is not only a art, but it also makes your code look good.

When you have a class that only requires property, then keep everything on one line.
If you have a class that contains more than one property, split it up onto multiple lines.

It'll look cleaner and faster to read.

.class { text-align: left; }

.class2 {
            background: #000;
            color: #999;
            width: 600px;
}