[WSG] @media ordering in stylesheet

2010-08-05 Thread Jody Tate
Hi all,

Does @media rule ordering in a stylesheet matter? For example, given the 
following order:

@media print {
body { 
#FF;
}
}

@media all {
body { 
#99;
}
}

Will @media print override the @media all in this ordering?

Googling around, I've not found a clear answer to the question. So, any help is 
appreciated. 

Thanks in advance,
jody

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



RE: [WSG] @media ordering in stylesheet

2010-08-05 Thread Erickson, Kevin (DOE)
No, the last one overrides the ones before it.

Kevin

-Original Message-
From: li...@webstandardsgroup.org [mailto:li...@webstandardsgroup.org]
On Behalf Of Jody Tate
Sent: Thursday, August 05, 2010 1:21 PM
To: wsg@webstandardsgroup.org
Subject: [WSG] @media ordering in stylesheet

Hi all,

Does @media rule ordering in a stylesheet matter? For example, given the
following order:

@media print {
body { 
#FF;
}
}

@media all {
body { 
#99;
}
}

Will @media print override the @media all in this ordering?

Googling around, I've not found a clear answer to the question. So, any
help is appreciated. 

Thanks in advance,
jody

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] @media ordering in stylesheet

2010-08-05 Thread David Storey


On 5 Aug 2010, at 19:20, Jody Tate wrote:


Hi all,

Does @media rule ordering in a stylesheet matter? For example, given  
the following order:


@media print {
body {
#FF;
}
}

@media all {
body {
#99;
}
}

Will @media print override the @media all in this ordering?


No. the @media all will apply (well if there were any valid rules in  
the block). If the specificity is the same (as is the case in this  
example) and the query conditions both apply then source order wins.




Googling around, I've not found a clear answer to the question. So,  
any help is appreciated.


Thanks in advance,
jody

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



David Storey

Chief Web Opener / Product Manager, Opera Dragonfly
W3C WG:  Mobile Web Best Practices / SVG Interest Group

Opera Software ASA, Oslo, Norway
Mobile: +47 94 22 02 32 / E-Mail/XMPP: dsto...@opera.com / Twitter:  
dstorey




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] @media ordering in stylesheet

2010-08-05 Thread Russ Weakley

Hey Jody,

First of all, the rules are incorrectly written. you need to include a  
property in front of the value:


@media print
{
body { color: #FF; }
}

@media all
{
body { color: #99; }
}


Secondly, the winner is the second rule. @media rules are just  
containers for a bunch of rules. They have no control over the  
cascade. The important thing here is the order they are written.


For printers you specify white text. Then for all devices (including  
printers) you specify a dark red text. The second rule wins due the  
the rules of the cascade:


both rules are from the same origin (author)
both rules have the same !important (none applied)
both rules have the same specificity (selector weight)

Therefore, the order that they are written in is the key and the last  
rule specified will win.


Thanks
Russ

--
Russ Weakley
Max Design
Phone: (02) 9410 2521
Mobile: 0403 433 980
Email: r...@maxdesign.com.au
Skype: russ-maxdesign
MSN: r...@maxdesign.com.au
Website: http://www.maxdesign.com.au/
Twitter: http://twitter.com/russmaxdesign
Linkedin: http://www.linkedin.com/in/russweakley
Slideshare: http://www.slideshare.net/maxdesign/
--




On 06/08/2010, at 3:20 AM, Jody Tate wrote:


Hi all,

Does @media rule ordering in a stylesheet matter? For example, given  
the following order:


@media print {
body {
#FF;
}
}

@media all {
body {
#99;
}
}

Will @media print override the @media all in this ordering?

Googling around, I've not found a clear answer to the question. So,  
any help is appreciated.


Thanks in advance,
jody

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] @media ordering in stylesheet

2010-08-05 Thread Jody Tate
Thanks for the responses. I needed the experts in the group to confirm my 
suspicions. 

Best,
jody

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] @media ordering in stylesheet

2010-08-05 Thread Russ Weakley

wow - three answers for the price of one  :)


On 06/08/2010, at 3:45 AM, David Storey wrote:



No. the @media all will apply (well if there were any valid rules in  
the block). If the specificity is the same (as is the case in this  
example) and the query conditions both apply then source order wins.




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***