Thread: CSS Menu Help

    #1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2007
    Posts
    85
    Rep Power
    12

    CSS Menu Help


    I made this CSS drop down menu for my website www.AftabTravels.com. If you take a look at it in IE, its not working. I am guessing I have to fix some stuff for IE 6.0. I don't know how to do it. This is the coding for the menu. Can someone please help me. Thanks.

    Code:
    <div id="navigation">
    <ul>
        <li><a id="current-page" href="index.html">Home</a></li>
        <li><a id="book-travel" href="booktravel.html">Book Travel</a> </li>
        <li><a href="#">Travel Agent Opportunity</a>
            <ul>
                <li><a href="presentation.html">YTB Presentation (Video)</a></li>
                <li><a href="agent.html">Refering Travel Agent Info</a></li>
                <li><a href="compensationplan.html">Money Making Process</a></li>
            </ul>               
        </li>
        <li><a href="contactme.html">Contact Me</a></li>
        <li><a href="joinnow.html">Become an Agent</a></li>
    </ul>
    </div>
    Code:
    #navigation ul li ul {
        list-style: none;
        position: absolute;
        left: 0;
        top:-9px;
    	width:100%;
    	background-color:#6A6A6A;
    	color:#FFFFFF;
    	visibility:hidden;
    }
    #navigation ul li:hover ul { 	
    	visibility:visible; 
    	}
    
    #navigation ul li ul li a{ 
    	display:block;
    	}
    #navigation ul li ul li { 
    	width:100%;
    	color:#FFFFFF;
    	text-decoration: none;
    	border-bottom:1px solid #8F8F8F;
    	font-size:13px;
    	}
    #navigation {
    	font-weight:bold;
    	font-size:14px;
    	text-align:left;
    	}
    #navigation ul { 
    	list-style:none;
    	margin:30px 0px;
    	padding:0px;
    	}
    #navigation ul li {
    	display:inline;
    	float: left;
        position: relative;
    	margin-right:10px;
    	}
    #navigation ul li a {
    	color:#FFFFFF;
    	padding: 5px 15px;
    	text-decoration: none;
    	}
    #navigation ul li a:hover {
    	background-color:#FFFFFF;
    	color:#000;
    	text-decoration: none;
    	}
  2. #2
  3. Permanently Banned
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Jun 2006
    Location
    In a whale
    Posts
    4,127
    Rep Power
    0
    IE6 <= doesn't let :hover on anything but the <a> element. Many fixes to this:

    A List Apart, Suckerfish dropdowns
    HTML Dog, Suckerfish dropdowns
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2007
    Posts
    85
    Rep Power
    12
    I am so confused. I can't figure out how to fix it. Can someone do it for me?
  6. #4
  7. Permanently Banned
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Jun 2006
    Location
    In a whale
    Posts
    4,127
    Rep Power
    0
    We do not do others work for free. The links which I provided show how to fix it for IE6 <=. What can you not figure out?

IMN logo majestic logo threadwatch logo seochat tools logo