css optimization

[Patrick]

Hi All,

Was wondering what optimizing a style sheet involves? I have a current
style sheet that weighs in at 9 KB. Is this considered large or small? I
tried a couple of these online optimizers. They take out all the white
space and make it next to impossible to read the file. One optimizer
left the css file useless. Good thing I didn't choose the same name as
my original file.

Which format would be better for a css file?

#topcontentright
{clear:right;
width:25%;
height:98px;
padding:0px;
float:right;
margin:0px;}
#topcontentright{clear:right;width:25%;height:98px ;padding:0px;float:right;margin:0px;}

Also is there a hierarchy as far as the order of properties for each
selector?

Thanks for your thoughts,
Patrick

[Jim Moe]

Patrick wrote:

>
Was wondering what optimizing a style sheet involves? I have a current
style sheet that weighs in at 9 KB. Is this considered large or small? I
tried a couple of these online optimizers. They take out all the white
space and make it next to impossible to read the file.

Removing whitespace is hardly optimizing. Well, it's optimizing for size
but even there that's a crude way to do it.
AFAIK there is no tool to actually trim the unused parts out of a CSS
file. The only useful tool here is your brain.
Are you including every style used throughout the site in one CSS file?
Or can you break it up into one common stylesheet and several specific
ones for particular pages?

Which format would be better for a css file?

It depends on which you find easier to maintain.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

[dorayme]

In article <f2**********@news1.usf.edu>,
Patrick <ps****@marine.usf.eduwrote:

Hi All,

Was wondering what optimizing a style sheet involves? I have a current
style sheet that weighs in at 9 KB. Is this considered large or small? I
tried a couple of these online optimizers. They take out all the white
space and make it next to impossible to read the file. One optimizer
left the css file useless. Good thing I didn't choose the same name as
my original file.

Which format would be better for a css file?

#topcontentright
{clear:right;
width:25%;
height:98px;
padding:0px;
float:right;
margin:0px;}
#topcontentright{clear:right;width:25%;height:98px ;padding:0px;float:right;mar
gin:0px;}

Also is there a hierarchy as far as the order of properties for each
selector?

If it is not just one or two instructions, consider:

#topcontentright {

clear:right;
width:25%;
height:98px;
padding:0px;
float:right;
margin:0px;
}

This way, the instructions line up neatly on left.

As for order, unless one instruction overrides another, as is in:

p {

margin: 0;
margin-top: 5px;
}
where order is important, the answer is yes.

But for many sets of instructions, order is not important as in:

p {

margin: 0;
padding: 0;
}

However, you need to look out carefully and I can't think of a
general answer.

--
dorayme

[Jim Moe]

Patrick wrote:

>
Also is there a hierarchy as far as the order of properties for each
selector?

All other things being equal, the last rule wins.
In other cases the more specific rule applies.
"!important" trumps everything else.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)