Question

I have noticed that when I look at a rule I have written say for example:

label { 
font-size: 12px; 
position: absolute; 
padding: 9px;
color: #666;
}

In firebug, it translates as:

label {
color: #666; 
font-size: 12px; 
padding: 9px;
position: absolute; 
}

Basically, reordering the styles. Why?

Is there an ‘ultimate’ priority I could be putting in my styles to improve load speeds? Ie is there a load order I’m unaware of?

Answer 1

The order of styles in your rule does not matter. Firebug seems to sort alphabetically in your case (it may be incidental).

Of course the order will do play role in this, problematic, case:

.foo {
    background: url(foo.png) top left repeat-x;
    background-image: url(bar.png);
}