<html><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; ">
<br><div><div>On 28 Jun 2007, at 21:07, Jason Flatt wrote:</div><br class="Apple-interchange-newline"><blockquote type="cite"><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">On Thursday 28 June 2007 11:13:22 Stephen Wills wrote:</div> <blockquote type="cite"><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">I have css elements to color the individual page titles in the block</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">book-navigation and as I hover over them they changes colors and all</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">is right with the world except I would like to highlight the page</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">title of the currently viewed page.<span class="Apple-converted-space"> </span>I am wondering if anyone knows a</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">CSS trick that will redefine the .leaf class when the anchor element</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">it encloses is of class=active?</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; min-height: 14px; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">Thanks.</div> </blockquote><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; min-height: 14px; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">This works for me:</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; min-height: 14px; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">li a.active {</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; "><span class="Apple-converted-space"> </span>color: <whatever>;</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; ">}</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; min-height: 14px; "><br></div></blockquote></div><div><br class="webkit-block-placeholder"></div><div>That would target the a tag. I think Stephen wants to target the parent li tag when the child has a class of active?</div><div><span class="Apple-style-span" style="font-family: Helvetica; "><li class="leaf"><a href="/" class="active">example</a></li></span></div><div><font class="Apple-style-span" face="Helvetica"><br class="webkit-block-placeholder"></font></div><div>I don't think there is a way of doing that with CSS.</div><div><br class="webkit-block-placeholder"></div><div>Maybe there's a way of adding a class to the .leaf using php in template.php...</div><div><span class="Apple-style-span" style="font-family: Helvetica; "><a href="http://drupal.org/node/72013">http://drupal.org/node/72013</a></span></div><div><br></div><div><br class="webkit-block-placeholder"></div><div>Mark</div><div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; "><font class="Apple-style-span" face="Helvetica"><br></font></div> </div></body></html>