CODEWITHSUNDEEP
cssperformancewhitespaceminify
Sam
Sam

Reputation: 15506

How to Minify CSS to its Absolute Minimalistic Essence?

Dear folks, staring at the minified CSS I put together so proudly the other night, I desparately tried to remove more chars here or there, like those wasted whitespace: " " meanwhile the more I stared at this code, the more I started to see patterns, clearly emerging from these bodies, asif this was the absolute minimum, plus some hidden message Now let me get to the point for this question is already too contaminated with nonvital letters already: Is there a way we could further minify my otherwise humungously gigantuous monster css file into a more bandwith friendly, really small file? Much appreceated!

enter image description here

Upvotes: 0

Views: 813

Answers (2)

Marcel
Marcel

Reputation: 28087

You've got a bunch of "0px" values in there, just make them "0" to save a couple of characters each there. Also, your negative text-indents could be -999em instead which saves a couple of characters and equals roughly the same depending on the base font-size.

And as @ithcy said, use short relative paths or re-host at imgur and reference as url(//imgur.com/name.jpg) instead will save some bytes too.

Edit: Duh, I just re-read @ithcy's answer and it mentions most of what I said anyway.

Upvotes: 2

ithcy
ithcy

Reputation: 5589

  1. If your css is hosted on the same site as your images, use relative paths in your url()s: background:url(/path/to/file.png)
  2. Use shorthand where applicable: margin:0 instead of margin:0px 0px 0px 0px
  3. Try running the CSS through a real minifier such as the YUI Compressor
  4. As a last resort, shorten your class names in the CSS and the related HTML
  5. Pass it to the left...

Upvotes: 2

Related Questions