Top 10 mistakes on CSS

1. Ignoring Browser Compatibility
This is probably the number one problem with web development, as you have to have layouts that look the same.

2. Not Accounting for Smaller Resolutions
There is a world of difference in the way a design looks in an 1024x768 resolution as opposed to a 800x600 resolution. It can make a beautiful design almost useless.

3. Not Considering Frameworks
Without having to start something from scratch. There are layouts with cross-browser compatibility and have been rigorously tested. Really, unless you're doing something totally radical that needs pantloads of custom code, just use a CSS framework.

4. Not Utilizing Generic Classes
It can be quite easy to not think about the future when we're developing websites. Often times we'll name our CSS classes something different each time we develop a site, as opposed to making a simple CSS class that we can reuse repeatedly throughout our design, without having to dig up what we used before. This will ensure that our site design remains constant throughout the changes of a design.

5. Not Validating the HTML
I bet you didn't know that validating your HTML could also affect your CSS! it can. First and foremost, you can't validate your CSS until you have valid HTML.

6. Not Validating the CSS
If you have valid CSS code, you're much more likely to have a CSS that is much more compatible across browsers and is less likely to break.

7. Using Mammoth Background Images
Often times new designers will use oversized background images in their layouts.
If you have a background image that is very large, you're losing two ways:
a. It means using unnecessary bandwidth
b. You're making the visitor wait longer for the image to load

8. Using CSS For Everything
When people first learn about a technology, they become excited about it and want to use it everywhere, even when it can actually go against what will work best for the project.

9. Using Inline CSS
This is a cardinal sin for web developers, and it happens more than you'd like to know. If you're building a design, you'll almost always want to keep your CSS and HTML separate.
This ensures that when you decide to change the site design, you won't have to dig through the HTML of each layout and find the rogue CSS attached to an inline element.

10. Using Too Many Files
It slows down the time processing each file, as the browser has to make a request for every single one. It's better to use a simple CSS schema that uses 1 or 2 files.
Nobody wants to open 10 files to make a simple, site-wide change!