Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts

    Question menu system - IE8 help?!

    hi, on my website: http://zend.warrencreative.com/menu/index.html in IE8,

    I cannot click on the sub links?!

    Please can someone help?

    thanks

    HTML
    Code:
    <html>
    <head>
    	<link href="menu-style.css" type="text/css" rel="stylesheet" />
    	<!--[if lte IE 8]>
    	<link rel="stylesheet" media="all" type="text/css" href="menu-style1.css" />
    	<![endif]-->
    
    </head>
    <body>
    
    	<div class="menu">
    		<ul>
    			<li>
    				<a class="hide" href="../menu/index.html">DEMOS</a>
    
    				<!--[if lte IE 8]>
    				<a href="../menu/index.html">DEMOS IE
    				<table cellspacing="0" cellpadding="0"><tr><td style="background-color:#ff0000;">
    				<![endif]-->
    				<ul>
    					<li><a href="../menu/zero_dollars.html" title="The zero dollar ads page">zero dollars</a></li>
    					<li><a href="../menu/embed.html" title="Wrapping text around images">wrapping text wrapping text wrapping text wrapping text wrapping text wrapping text wrapping text</a></li>
    					<li><a href="../menu/form.html" title="Styling forms">styled form</a></li>
    					<li><a href="../menu/nodots.html" title="Removing active/focus borders">active focus</a></li>
    				</ul>
    				<!--[if lte IE 8]>
    				</td></tr></table>
    				</a>
    				<![endif]-->
    			</li>
    		</ul>
    
    	</div>
    </body>
    </html>
    Firefox CSS
    Code:
    /* common styling */
    .menu {font-family: arial, sans-serif; width:200px;  position:relative; font-size:11px; z-index:100;}
    .menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000; text-align:left; color:#fff; border:1px solid #fff; background:#710069; line-height:20px; font-size:11px; }
    .menu ul {padding:0; margin:0; list-style: none; overflow:visible;}
    .menu ul li {  }
    .menu ul li ul {display: none; width:400px; }
    
    /* specific to non IE browsers */
    .menu ul li:hover a {color:#fff; background:#36f;}
    .menu ul li:hover ul {display:block; clear:both; }
    .menu ul li:hover ul li a.hide {background:#6a3; color:#fff;}
    .menu ul li:hover ul li:hover a.hide {background:#6fc; color:#000;}
    .menu ul li:hover ul li ul {display: none;}
    .menu ul li:hover ul li a {display:block; background:#ddd; color:#000;}
    .menu ul li:hover ul li a:hover {background:#6fc; color:#000;}
    .menu ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
    .menu ul li:hover ul li:hover ul.left {left:-105px;}
    IE 8 CSS
    Code:
    .menu ul li a.hide, .menu ul li a:visited.hide {display:none;}
    .menu ul li a:hover ul li a.hide {display:none;}
    
    .menu ul li a:hover {color:#fff; background:#36f;}
    .menu ul li a:hover ul { display:block; clear:both;}
    .menu ul li a:hover ul li { }
    .menu ul li a:hover ul li a.sub {background:#6a3; color:#fff; }
    .menu ul li a:hover ul li a {display:block; background:#ddd; color:#000;}
    .menu ul li a:hover ul li a ul {overflow:hidden;}
    .menu ul li a:hover ul li a:hover {background:#6fc; color:#000;}
    .menu ul li a:hover ul li a:hover ul {overflow:visible; color:#000;}
    .menu ul li a:hover ul li a:hover ul.left {left:-105px;}

  • #2
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,950
    Thanks
    9
    Thanked 724 Times in 718 Posts
    You've no doctype, for a start. That may well be causing the issue in IE.

    And there's surely no need for tables here...

  • #3
    Banned
    Join Date
    Mar 2007
    Posts
    1,523
    Thanks
    116
    Thanked 0 Times in 0 Posts
    Thank you so much for your help!


  •  

    Posting Permissions

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