What are some Best CSS Practices, Do you Re-use previous CSS? How about Frameworks?

Question

Hi,

I'm compiling Great Ideas how to optimize and improve your CSS. What are your best practices that you would like to share? Do you use frameworks? Do you re-use your CSS? Do you document your CSS?

Please share. Thanks!

Additional Question,

How do you generated IDs and Class in naming your markups... are they generic or specific? Are most of your project has a similar class and ids?

Thanks!

Answer 1

You might like to ask this on doctype.com.

Answer 2

I like to use the 960 grid system, it works like a champ. Other than that, the only CSS I normally reuse are stuff I use on forms.

http://960.gs/

Answer 3

I'm a fan of the Blueprint CSS framework:

Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.

Answer 4

Be sure to read Steve Souders's book "Even Faster Web Sites." There's at least one chapter in there that deals with the performance aspects of CSS selectors. It may surprise you which kinds of selectors are "high performance" and which are not - it's completely unintuitive.

Answer 5

I created my own CSS file that I re-use and basically it has only this:

html, body {
    margin: 0;
    padding: 0;
}

body {
    color: #000;
    font: 14px/20px Helvetica, Verdana, Arial, sans-serif;
}


/*** COMMON ELEMENTS
**************************************/

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

blockquote {
    font-size: 16px;
    line-height: 22px;
}

.left {
    float: left;
}

.right {
    float: right;
}

/*** 
**************************************/

The rest I like to change on the fly since every project/site is different.

As for other things, you can follow this short list - 6 Easy Tips To Make Your CSS Efficient

Hope this helps