View Single Post
  #1 (permalink)  
Old May 6th, 2008, 09:02
bonnit bonnit is offline
Junior Member
Join Date: Apr 2008
Location: uk
Age: 23
Posts: 38
Thanks: 0
Thanked 0 Times in 0 Posts
ie 5.5 and ie 6 display problems

hi im using a css styled unordered list for my fly out navigation but it is not working just in these browser, is this a know issue and if so is there a quick fix?? it is menu1 in particular that has issues and im using conditional comments to include an ie6 and above css page, ive tried changing the comments to include 5.5 but no avail???

navigation css
Code: Select all
/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyoutt.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */
.textright {text-align:right;}
.menu {
 font-family:Verdana, Arial, Helvetica, sans-serif;
 width:170px;
 height:340px;
 position:relative;
 margin:0px;
 font-size:11px;
 font-weight:normal;
 line-height:normal;
}
.menu ul li a, .menu ul li a:visited {
 display:block;
 text-decoration:none;
 color:#fff;
 width:170px;
 height:25px;
 text-align:left;
 background:#000;
 line-height:20px;
 font-size:11px;
 border:1px #ffffff;
}
.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {margin-right:1px; position:relative;}
.menu ul li ul {display: none;}
/* specific to non IE browsers */
.menu ul li:hover a {color:#fff; background:#000;}
.menu ul li:hover ul {display:block; position:absolute; top:0; left:170px; width:170px;}
.menu ul li:hover ul li a.hide {background:#000; color:#fff;}
.menu ul li:hover ul li:hover a.hide {width:170px;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#000; color:#fff; width:170px;}
.menu ul li:hover ul li a:hover {background:#000; color:#fff;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:170px; top:0; color:#fff;}
.menu ul li:hover ul li:hover ul li a {display:block; width:170px; background:#000; color:#fff;}
.menu ul li:hover ul li:hover ul li a:hover {background:#000; color:#fff;}
/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/dd_valid.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */
.menu1 {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 width:800px;
 height:20px;
 position:relative;
 font-size:11px;
 z-index:100;
}
.menu1 ul li a, .menu1 ul li a:visited { display:block; text-decoration:none; color:#000; width:114px; height:20px; text-align:left; color:#fff; line-height:20px; font-size:11px; overflow:hidden; background-color: #000000;}
.menu1 ul {padding:0; margin:0; list-style: none;}
.menu1 ul li {float:left; position:relative;}
.menu1 ul li ul {display: none;}
/* specific to non IE browsers */
.menu1 ul li:hover a {color:#fff; background:#000;}
.menu1 ul li:hover ul {display:block; position:absolute; top:21px; left:0; width:130px;}
.menu1 ul li:hover ul li a.hide {background:#000; color:#fff;}
.menu1 ul li:hover ul li:hover a.hide {background:#000; color:#fff;}
.menu1 ul li:hover ul li ul {display: none;}
.menu1 ul li:hover ul li a {display:block; background:#000; color:#fff;}
.menu1 ul li:hover ul li a:hover {background:#000; color:#fff;}
.menu1 ul li:hover ul li:hover ul {display:block; position:absolute; left:105px; top:0;}
.menu1 ul li:hover ul li:hover ul.left {left:-105px;}
if ie6 navigation css
Code: Select all
/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyoutt.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
table {border-collapse:collapse; border:0; margin:0; padding:0;}
.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:#000;}
.menu ul li a:hover ul {display:block; position:absolute; top:0; left:170px; width:175px;}
.menu ul li a:hover ul li a.sub {background-color:#000; background:#000; color:#fff;}
.menu ul li a:hover ul li a {display:block; background:#000; color:#fff; width:170px;}
.menu ul li a:hover ul li a ul {visibility:hidden;}
.menu ul li a:hover ul li a:hover {background:#000; color:#fff;}
.menu ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:170px; top:0; color:#fff;}
.menu ul li a:hover ul li a:hover ul li a {display:block; width:175px; background:#000; color:#fff;}
.menu ul li a:hover ul li a:hover ul li a:hover {background:#000; color:#fff;}
/* ================================================================ 
This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/dd_valid.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.menu1 ul li a.hide, .menu ul li a:visited.hide {display:none;}
.menu1 ul li a:hover ul li a.hide {display:none;}
.menu1 ul li a:hover {color:#fff; background:#000;}
.menu1 ul li a:hover ul {display:block; position:absolute; top:21px; left:0; width:114px;}
.menu1 ul li a:hover ul li a.sub {background:#000; color:#fff;}
.menu1 ul li a:hover ul li a {display:block; background:#000; color:#fff;}
.menu1 ul li a:hover ul li a ul {visibility:hidden;}
.menu1 ul li a:hover ul li a:hover {background:#000; color:#fff;}
.menu1 ul li a:hover ul li a:hover ul {visibility:visible; position:absolute; left:114px; top:0; color:#000;}
.menu1 ul li a:hover ul li a:hover ul.left {left:-114px;}
Reply With Quote