SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Wizard
    Join Date
    Dec 2003
    Location
    USA
    Posts
    2,582
    Mentioned
    29 Post(s)
    Tagged
    0 Thread(s)

    CSS Dropdown Menu - Hiding from <=IE6

    Hello, on my page: http://www.aggis-topography.com/azureronin, I have a CSS dropdown menu. It works fine in FF and IE7, but acts up in IE6. I knew this would be the case, and is acceptable since the site is perfectly navigable without the drop-down.

    Thus, I want to simply hide the drop-down section entirely from <=IE6, but I can't quite figure out how. I know I can use the * html trick to make only IE6/5.5 see the CSS, but I'm not sure what CSS to put.

    The menu is structured as such:
    Code:
    <div id="menu">
    <ul>
        <li><a>link</a>
        <dl>
            <dd>
                 <ul>
                       <li><a>sublink</a></li>
                 </ul>
             </dd>
         </dl>
         </li>
    </ul>
    </div>
    And the CSS is:
    Code:
    #menu li > dl {
    	display: none;
    }
    
    #menu li:hover > dl {
    	display: block;
    	position: absolute;
    	border: 2px solid black;
    	background-color: #348370;
    	margin-top: 3px;
    	z-index: 2;
    }
    
    #menu li:hover > dl li {
    	float: none;
    	margin-left: 3px;
    	margin-right: 3px;
    	width: auto;
    	text-align: left;
    	font-weight: 100;
    }
    Thanks.

  2. #2
    SitePoint Wizard
    Join Date
    Dec 2003
    Location
    USA
    Posts
    2,582
    Mentioned
    29 Post(s)
    Tagged
    0 Thread(s)
    Ah, I got it.

    I simply added:
    Code:
    * html #menu li dd, * html #menu li dt {
    	height: 0px;
    	overflow: hidden;
    }
    after the other CSS. Hope that can help someone else.

    I was trying to apply that to the dl, but IE didn't like that, so I had to apply it to the dt and dl.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •