...

View Full Version : Fixing horizontal list items for Mac IE



niemie
08-12-2005, 05:44 PM
I think I have only one bug to overcome in my CSS - it's for Mac IE.

A picture is attached - my subnav links display vertically instead of how they should which is horizontally on the subnav bar. What is the fix for this?

Page is here: http://www.ricochetnetwork.com

navigational CSS is:


#nav {
list-style:none;
width:416px;
float:right;
width:420px !important;
}
#nav li {
width:100px;
height:20px;
margin-left:4px;
float:left;
position:relative;
}
a.inactive, a.inactive:link, a.inactive:visited, a.inactive:active {
display:block;
height:15px;
background-image:url(../images/inactive.gif);
background-repeat:no-repeat;
color:#999999;
text-align:center;
text-decoration:none;
padding-top:5px;
font-weight:bold;
}
a.inactive:hover {
color:#888888;
}
a.active, a.active:link, a.active:visited, a.active:active {
display:block;
position:absolute;
width:100px;
height:16px;
top:0;
left:0;
z-index:1;
background-image:url(../images/active.gif);
background-repeat:no-repeat;
color:#334C99;
text-align:center;
text-decoration:none;
padding-top:5px;
font-weight:bold;
}
#subnav {
list-style:none;
background-image:url(../images/subnav_background1.gif);
height:22px;
clear:both;
border:1px solid #CECECE;
color:#999999;
}
#subnav li {
width:105px
height:18px;
text-align:center;
float:right; /*Change order of subnavs high to low or low to high*/
}
#subnav li a, #subnav li a:link, #subnav li a:visited, #subnav li a:active {
display:block;
height:14px;
padding-top:4px;
text-decoration:none;
}
#subnav li a, #subnav li a:link, #subnav li a:visited {
color:#888888;
}
#subnav li a:hover {
color:#334C99;
}
#subnav li a:active {
color:#334C99;
}

Tristan Gray
08-12-2005, 06:53 PM
I wish I had a way of testing my sites on mac.

niemie
08-12-2005, 07:01 PM
Me too - and we do:

http://www.danvine.com/icapture/

http://www.browsercam.com/

Tristan Gray
08-12-2005, 07:11 PM
*tips hat*

Thanks kidly, good sir. Once I view your page I will try to help, although I can make no promises.

rmedek
08-13-2005, 01:11 AM
At first glance I would say to make sure everything has a width... that usually fixes most of my mac IE (and Opera) probs with floats.

niemie
08-13-2005, 06:48 PM
I tried width:auto; in the 2 ids that don't have them and it got worse (picture attached).

Love the Lebowski reference by the way.... :)

mrruben5
08-13-2005, 07:55 PM
What about stu's solution to horizontal navigation lists?
http://www.stunicholls.myby.co.uk/menus/centered2.html

niemie
08-14-2005, 12:47 AM
Thanks for the link - I hate to swtich the whole thing out as it works, just not in Mac IE. I haven't been able to figure out why but I am hoping there is a simple fix.

brothercake
08-15-2005, 08:59 PM
I just tried it in 5.2 on OSX, and it works fine.

niemie
08-15-2005, 09:05 PM
That's strange - I should have paid attention to the OS, I didn't realize that would matter though. I thought it was just IE.....



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum