4 {{ upvoteCount | shortNum }}
4 {{ upvoteCount | shortNum }}

How to Format and/or Compress CSS

by JamesFraze
3 replies
  • WEB DESIGN
    • |
May or may not be useful to my fellow warriors, but I can't stand looking at the default css formatting most people use - especially when troubleshooting it.

I was bored this afternoon and created this.
http://expert-marketer.com/cgi-bin/css-formatter.cgi

Make sure you don't compress the CSS headers in wordpress, just the actual code.

Here is an example of a header - DO NOT change these, or your wordpress theme will break:
/*
Theme Name: Clean CSS
Theme URL: http://expert-marketer.com/cgi-bin/css-formatter.cgi
Description: I hate flash designs - they ruin your SEO
Author: James Fraze
Author URI: http://expert-marketer.com
Tags: clean,format,readable,ledgible,valid,troubleshooti ng
Version: 1.1234
*/

As always - your comments are appreciated. I desire to improve.
#and or or #compress #css #format
  • Profile picture of the author Steve Diamond
    Hi, James. A fellow Arizonan, I see! Practically neighbors.

    Thanks for this nice little tool. The one extra feature I'd like to see is to indent, in the uncompressed version, each line that comes between curly braces. IOW instead of this:
    Code:
    textarea{
width:500px;
margin-left:auto;
margin-right:auto;
}
    Have this:
    Code:
    textarea{
    width:500px;
    margin-left:auto;
    margin-right:auto;
}
    If you really wanted to get fancy, you could give the user a choice of how many spaces to use for indentation (between 0 and 8, say). You could also give a choice of whether or not to insert a space after each colon, which happens to be my preference because I think it's more readable. Like this:
    Code:
    textarea{
    width: 500px;
    margin-left: auto;
    margin-right: auto;
}
    Nice going.

    Steve
    Signature
    Mindfulness training & coaching online
    Reduce stress | Stay focused | Keep positive and balanced
    {{ DiscussionBoard.errors[1060325].message }}
  • Profile picture of the author tstockil
    Thanks to both, much improved.
    Signature

    Tony Stockill
    theze-group.com

    {{ DiscussionBoard.errors[1060464].message }}

Trending Topics