Francky, I think you nailed it. Thanks so much. Jim -----Original Message----- From: francky [mailto:[EMAIL PROTECTED] Sent: Thursday, January 19, 2006 7:43 AM To: Jim Ryan Cc: CSS Email List Subject: Re: [css-d] defining span?
Jim Ryan wrote: >Hi, >On the page http://ixlr8.org/newacting [...] >[...] the .lw1 span overrides any definition I give to .expanded. Not >only that, but because the .lw1 span is applied to all <LI>'s, any >redefinition of it affects every other righnav <LI> as well. This I don't >want. >[...] whatever may be the right way of expressing this item's place in >the style cascade, I haven't hit on it. Any suggestions? > >Thanks! >Jim > Hi Jim, The css-cascade in the essential part you want to influence is: = = = = = <ul> <li class="collapsed"><a href="link1"><span class="lw1">Dance</span></a></li> <li class="leaf"><a href="link2"><span class="lw1">Drama</span></a></li> <li class="leaf"><a href="link3"><span class="lw1">Music</span></a></li> <li class="expanded"><a href="link4"><span class="lw1">Special Cultural Programs</span></a> <ul> <li class="leaf"><a href="link5"><span class="lw1">Alvin Ailey Camp</span></a></li> <li class="leaf"><a href="link6"><span class="lw1">Children's Aid Chorus</span></a></li> <li class="leaf"><a href="link7" class="active"><span class="lw1">The New Acting Company</span></a></li> </ul> </li> <li class="collapsed"><a href="link8"><span class="lw1">Visual Arts</span></a></li> </ul> = = = = = So written, it will be easy to see: If the class="collected", and the span class="lw1", then then right style is ... If the class="expanded", and the span class="lw1", then then right style is ... If the class="expanded", and the span class="lw1", but you are in the subitems with class="leaf", then then right style is ... [...] Therefore: .collapsed .lw1 {border: 1px solid red;} .expanded .lw1 {border: 1px solid green;} .expanded .leaf .lw1 {border: 1px solid yellow;} [...] might be helpfull. Quick see what happens? Use the Chris Pederick's Firefox Developers Extention, go to the css-button and hit "Edit css". Then just add these 3 lines. With this instant cooking you can tackle lots of problems in less time then needed for writing down this! ;-) francky ______________________________________________________________________ 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/
