How to compress CSS

Question

I looked at half a dozen CSS optimizers. What I'm looking for is the one that will look:

background-image: url(../images/background.png); background-repeat: repeat-x; background-color: #c0c0c0; 

In the single background property:

 background: #c0c0c0 url(../images/background.png) repeat-x; 

How can i do this? Do I have to do it manually?

Answer 1

Try http://www.cssoptimiser.com/

Input:

 body { background-image: url(../images/background.png); background-repeat: repeat-x; background-color: #c0c0c0; } 

(I noted "Do not delete line breaks")

Output:

 body { background:#c0c0c0 url(../images/background.png) repeat-x } 

Note that it also optimized space - you requested background:<space>#... :)

There may be other / better tools that can do this, but this site really matches your desire.

Answer 2

Make sure gzip is enabled on your server (or some other form of compression for text files).