2 replies [Last post]
ballr
ballr's picture
Offline
newbie
Last seen: 4 years 26 weeks ago
Timezone: GMT-4
Joined: 2010-05-27
Posts: 2
Points: 3

Hi Everyone!

I have been trying to style a CSS based menu specifically for IE6 (about a fourth of our users are on IE6). I can't figure out how to widen the area for the

  • . It is squeezed and causing the text to be split into multiple lines.
  • In addition, the "fly-out" part isn't working? Do I need the csshover.htc file for that to work?

    AND to throw another wrench in the works, I am building the site and menu in Umbraco (open-source dot net CMS). Below is the CSS I'm using in the ie6_styles.css file.

    /*	************************************************************
    	Specialty Market Flyout Menu
    	************************************************************
    */
    .menu2{
    	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 
    	width:325px; 
    	height:160px; 
    	position:absolute; 
    	font-size:12px; 
    	margin:0 0; 
    	display:block;
    }
    .menu2 ul {
    	padding:0; 
    	margin:0 0 0 -10px; 
    	list-style-type: none; 
    	background:#eee; 
    	width:325px; 
    	height:160px; 
    	border:1px solid #2356B6;
    	display:block;
    }
    .menu2 ul li ul {
    	visibility:hidden; 
    	position:absolute; 
    	height:0; 
    	overflow:hidden; 
    	top:0; 
    	left:200px;
    	display:block;
    }
    .menu2 ul li {
    	display:block;
    	float:left;
    	width:325px;
     
    }
    .menu2 ul li a, .menu2 ul li a:visited {
    	display:block; 
    	float:left; 
    	text-decoration:none; 
    	color:#999999; 
    	height:auto; 
    	line-height:25px; 
    	width:190px; 
    	background:transparent; 
    	padding-left:10px;
    }
     
    //////* end top level of fly out menu *///////
     
     
    * html .menu2 ul li a, * html .menu2 ul li a:visited {
    	width:100px; 
    	w\idth:90px;}
     
    .menu2 table {
    	border-collapse:collapse; 
    	border:0; 
    	margin:0; 
    	padding:0px; 
    	font-size:0em; 
    	position:absolute; 
    	left:0; 
    	top:0;
    }
     
    /* first line for IE7 and non-IE browsers - second line for IE5.5 and IE6 */
     
    .menu2 ul li:hover a,
    .menu2 ul li a:hover{
    	background:#2356B6; 
    	color:#fff;
    }
     
    .menu2 ul li:hover {position:relative; z-index:100;}
    * html .menu2 ul li a:hover {position:relative; z-index:100;}
     
    .menu2 ul li:hover ul,
    .menu2 ul li a:hover ul {
    	visibility:visible; 
    	position:absolute; 
    	height:auto; 
    	border:1px solid #2356B6; 
    	background:#7a7a7a;
    	padding: 0 15px 0 0; 
    	overflow:visible;
    	width:250px;
    }
    .menu2 ul li:hover ul li a,
    .menu2 ul li a:hover ul li a{
    	display:block; 
    	background:transparent; 
    	color:#fff; 
    	line-height:15px; 
    	padding:5px 0 5px 10px; 
    	height:auto; 
    	text-decoration:underline; 
    	width:250px;
    }
     
    .menu2 ul li:hover ul li:hover a,
    .menu2 ul li a:hover ul li a:hover {
    	background:#2356B6; 
    	color:#fff; 
    	width:250px;
    }
    .menu2 ul li:hover ul li ul,
    .menu2 ul li a:hover ul li a ul {
    	visibility:hidden; 
    	position:absolute; 
    	height:0; 
    	overflow:hidden; 
    	top:0; 
    	left:105px;
    }
    .menu2 ul li:hover ul li:hover ul,
    .menu2 ul li a:hover ul li a:hover ul {
    	visibility:visible; 
    	position:absolute; 
    	height:auto; 
    	color:#000; 
    	padding:0; 
    	border:1px solid #2356B6; 
    	list-style-type:none; 
    	background:#7a7a7a;
    }
    .menu2 ul li:hover ul li:hover ul li a,
    .menu2 ul li a:hover ul li a:hover ul li a {
    	display:block; 
    	background:transparent; 
    	color:#fff;
    }
     
    .menu2 ul li:hover ul li:hover ul li:hover a,
    .menu2 ul li a:hover ul li a:hover ul li a:hover {
    	background:#2356B6; 
    	color:#fff;
    }
     
    /*	************************************************************
    	End Specialty Market Flyout Menu
    	************************************************************
    */

    If you want to see the menu you can try this link (not sure if the public can see this) - http://beta.testamericainc.com/services/specialty-services/source-air-testing.aspx

    Thanks for your help!

    jon19870
    jon19870's picture
    Offline
    Enthusiast
    Lancashire, England, UK
    Last seen: 1 year 9 weeks ago
    Lancashire, England, UK
    Timezone: GMT+2
    Joined: 2007-01-05
    Posts: 195
    Points: 194

    what's building the site in

    what's building the site in Umbraco got to do with it Tongue You need to edit your post as we don't know what element your referring to. Smile

    ballr
    ballr's picture
    Offline
    newbie
    Last seen: 4 years 26 weeks ago
    Timezone: GMT-4
    Joined: 2010-05-27
    Posts: 2
    Points: 3

    RESOLVED!

    Thanks for your help!!!!