Michael Hulse wrote:

>On Dec 1, 2005, at 3:41 AM, Kevin Cannon wrote:
>  
>
>>      <div id="tabs" class="ski">...</div>
>>
>>      #tabs.ski {
>>              background-color: green;
>>      }
>>    
>>
>
>Excuse my noobieneess...
>
>Why not:
>
><div id="tabs" class="ski">...</div>
>
>/* Make .ski green: */
>#tabs .ski {
>       background-color: green;
>}
>  
>

This selects an element with the class of ski *inside* an element with 
the id of #tabs.  This is because the space between the two parts of the 
selector makes it a descendant selector.  It does not select an element 
with both the class and the id on it.  The syntax from the original 
poster is correct to select something with both set on it.

I can't stress enough that everyone should read this article.
http://css.maxdesign.com.au/selectutorial/

Not understanding desendant selectors is a very common problem but an 
essential one to eradicate if you want to work with CSS.

>/* Make .ski red: */
>#tabsTwo .ski {
>       background-color: red;
>}
>  
>

This would only make ski red if it was inside #tabsTwo.

>/* Or, make #tabs and .ski green: */
>#tabs, .ski {
>       background-color: green;
>}
>  
>

This would work.

>/* Or, even: */
>#tabs, #tabs .ski {
>       background-color: green;
>}
>  
>

This would work, but only because of the first part of the selector.  
The second part selects nothing in the HTML snippet provided.

Zoe

-- 
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to