Grow your CSS skills. Land your dream job.

Drop down menu Help!

  • # December 24, 2012 at 2:18 am

    #Menu {
    clear:left;
    height:48px;
    margin:0 15px;
    border-bottom:1px solid #c0c0c0;
    z-index:3;
    }
    #Menu ul {
    list-style:none;
    }
    #Menu ul li {
    float:left;
    position:relative;
    }
    #Menu ul li a {
    display:block;
    height:48px;
    text-indent:-999em;
    }
    #Menu ul li a#MenuHome {
    width:66px;
    margin-left:12px;
    margin-right:80px;
    background:url(“../images/menu_home.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a#MenuWhoWeAre {
    width:117px;
    margin-right:79px;
    background:url(“../images/menu_who_we_are.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a#MenuWhatWeDo {
    width:118px;
    margin-right:79px;
    background:url(“../images/menu_what_we_do.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a#MenuGetInvolved {
    width:126px;
    margin-right:82px;
    background:url(“../images/menu_get_involved.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a#MenuNews {
    width:64px;
    margin-right:80px;
    background:url(“../images/menu_news.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a#MenuDonate {
    width:81px;
    background:url(“../images/menu_donate.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu ul li a:hover {
    background-position:0 -48px !important;
    }
    /* Highlist current page */
    body#Home #Menu ul li a#MenuHome,
    body#WhoWeAre #Menu ul li a#MenuWhoWeAre,
    body#WhatWeDo #Menu ul li a#MenuWhatWeDo,
    body#GetInvolved #Menu ul li a#MenuGetInvolved,
    body#News #Menu ul li a#MenuNews,
    body#Donate #Menu ul li a#MenuDonate {
    background-position:0 -48px !important;
    }
    #Menu .subMenu {
    position:absolute;
    display:none;
    top:0;
    left:-7px;
    width:270px;
    height:284px;
    background:url(“../images/dropdown_who_we_are.png”) no-repeat scroll 0 0 transparent;
    z-index:21;
    }
    #Menu .subMenu.whatWeDo {
    background:url(“../images/dropdown_what_we_do.png”) no-repeat scroll 0 0 transparent;
    }
    #Menu .subMenu.getInvolved {
    background:url(“../images/dropdown_get_involved.png”) no-repeat scroll 0 0 transparent;
    }

    Can you help me with this css? I want to have submenu just like on this page http://www.transparency.org, but I tried to add submenu and it doesn’t work

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".