A CSS3 generator which will help you design and learn how to make CSS3 Buttons. By using this generator it will save you time and effort in creating that perfect CSS button for your site.
CSS optimization is key, but some times it becomes really hard to update it with the compressed version and i always use to require the uncompressing tool. Here is the one of the best tool i use. You can use this utility to uncompress your CSS files; in other words make them nicely formatted again.
Visit: UnCompress CSS Tool
LESS is basically a dynamic style sheet language (CSS pre-processors). Confused? Its a kind of framework. In simple terms LESS extends CSS and give it a capability of variables, mixins, operations and functions. Visit: http://lesscss.org/ for more information
If you want to use a specific external StyleSheet file for IE6,7 or 8 users to work around CSS display/rendering bugs in IE6,7 or 8, then you need to perform some form of browser detection. Here is how it can be done via conditional comments:
To Detect IE6:
<!–[if IE 6]>
<link type=”text/css” rel=”stylesheet” href=”ie6.css” />
<![endif]–>
To Detect IE7
<!–[if IE 7]>
<link type=”text/css” rel=”stylesheet” href=”ie7.css” />
<![endif]–>
Or target Version above 7
<!–[if gte IE 7]>
<link type=”text/css” rel=”stylesheet” href=”style.css” />
<![endif]–>
In the similar way you just need to replace 7 with your version. e.g for IE8 just replace it with 8.
We all know (think so..
) that CSS stands for Cascading style Sheets, but what if someone ask us to define word CSS only. I read some where a very cool definition of CSS. Here i am sharing with you:
“CSS is a declarative language made of selectors, properties, values and schemes for priority and inheritance, defining how style apply”
The difference between padding and margin can be clearly understood by this diagram.

If Confusion still persist recommendation is to bookmark this post so you can see the model again and again.
I was asked a Question, “How do i can verify whether the CSS i have written is correct or not?”, kindly use the following tools or website: Visit Validator
Is there a way to make a background image resizeable? As in, fill the background of a web page edge-to-edge with an image, no matter the size of the browser window. Also, have it resize larger or smaller as the browser window changes. Also, make sure it retains its ratio (doesn’t stretch weird).
CSS is a very important and essential element of your work, if it is not properly managed then it could result in a crapy application. It is recommended for everyone to use the 2 very best tools while doing the css.
1. Fire Bug
Firebug is a Mozilla Firefox extension that gives you plenty of web development tools and features. Firebug has a built-in JavaScript debugger that lets you step through your script as well as allowing you to perform benchmarks to see why your script is slow/sluggish.
You can quickly hunt down CSS, HTML, JavaScript, and XML errors through Firebug, and it even allows you to filter and search for specific errors. Another handy feature is the DOM inspector pane which outlines a web page’s structure; very handy if you’re working on a big website or an open-source application that you’ve recently gotten involved with. It’s an awesome tool though I find that disabling Firebug when I’m not using it is helpful in speeding up normal browsing (such accessing Gmail, for example).
2. Internet Explorer Developer Toolbar

Even if you prefer Firefox (or Safari) to develop and test your web pages, you have to test your stuff in the Internet Explorer browser for cross-compatibility. Whenever I test in IE, there are plenty of times when I wish certain features in Firebug and the Web Developer extension are accessible through IE, such as the DOM inspector option or the CSS Information option. IE Developer Toolbar is the IE add-on that provides me the features I like in my Firefox extensions.