troubleshooting Question

descendant selector nav problem

Avatar of Arnold Layne
Arnold LayneFlag for United States of America asked on
CSSHTML
9 Comments3 Solutions368 ViewsLast Modified:
I use descendant selectors a lot because I like to get every attribute that I can off the html page. Here''s my nav.

<div id="nav">
       
        <div id="home"></div>

            <ul class="navt">
                <li><a href="#" id="navLoan">LOAN CENTER</a></li>
                <li><a href="About.aspx" id="navAbout">ABOUT US</a></li>
                <li><a href="Contact.aspx" id="navContact">CONTACT US</a></li>
                <li><a href="Testimonials.aspx" id="navTestimonials">TESTIMONIALS</a></li>
                <li><a href="#" id="navResources">RESOURCES</a></li>
                <li><a href="#" id="navFAQ">FAQ</a></li>
                <li><a href="#" id="navHome">HOME</a></li>
            </ul>
        </div>

Here's the related css for the nav

.navt a
{
    color:#FFF;
    text-decoration:none;
    display:block;
    line-height: 45px;
    height:100%;
    padding: 0 25px;
    text-transform: uppercase;
    border-right:1px solid #424542;  
}

This empty div from above <div id="home"></div> is supposed to tell my css what the current page is and in this case, it's the home page. I want to add a background image to the nav link that corresponds to the current page (the home link). This doesn't work and doesn't inherit any styling.

#home #navHome
{
    background-image:url(..images/navtbgCurrentTop.png);
}

So how do I inherit all of the styling from the normal nav links and simply add a background image in the case of the link that represents the current page? Currently, it looks like none of the nav links have any styling and before I added the current page div (home div) and the associated css it worked great. I want to accomplish this without javascript and I know there must be a correct way to do this in css.
ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 3 Answers and 9 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 3 Answers and 9 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros