treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Missing Something with Hover Menu

  • I'm trying to set up a menu with a background image applied to the anchor link via a class. The anchor link seems to have the correct dimensions but no matter what i do i can't get the background image to display. Am i missing something fundamental? Any help much appreciated!

    Thanks,

    Nick

    CSS:
    ul#menu {
    list-style:none;
    }
    ul#menu li {
    display:inline;
    }
    ul#menu li a {
    display:block;
    width:150px;
    height:120px;
    float:left;
    }
    ul#menu li a.home {
    background-image:url(images/menunormal_01.png);
    }
    ul#menu li a.about {
    background:url(images/menunormal_02.png);
    }
    ul#menu li a.contact {
    background:url(images/menunormal_03.png);
    }


    html:

    <ul id=\"menu\">

    <li><a href=\"/\">Home</a></li>
    <li><a href=\"/about.html\">About</a></li>
    <li><a href=\"/contact.html\">Contact</a></li>

    </ul>
  • You haven't applied any classes to the links ;)
  • schoolboy error :oops: ! thanks for that nick