3 replies [Last post]
aclighting
Offline
newbie
Last seen: 13 years 5 weeks ago
Timezone: GMT+1
Joined: 2007-09-10
Posts: 3
Points: 0

Here is a challenge for you, and if you can help I would be really grateful.

http://www.aclighting.com/shop/

If you view this in IE6 you will see the tabbed menu is all underneath each other, it should be lined up nicely in a row.

Can anyone figure out what I need to do to get it working in IE6?

Cheers,

Steve

aclighting
Offline
newbie
Last seen: 13 years 5 weeks ago
Timezone: GMT+1
Joined: 2007-09-10
Posts: 3
Points: 0

I followed A List Aparts method for sliding doors with no joy

I always try to work out my problems and usually end up posting how I fixed it, but in this case I have followed a proven method and still not made any progress.

I have simplified my CSS making it easier to understand and it is now based upon A List Aparts Sliding Doors technique, but I still can't get IE6 to like it.

Here is my CSS:
#header #navigation {
margin: 0px;
padding: 0px;
width: 780px;
float: left;
}
#header #navigation ul {
list-style: none;
padding: 0px;
margin: 0px;
}
#header #navigation li a {
display: block;
color: #FFFFFF;
text-decoration: none;
padding-left: 15px;
height: 25px;
font-size: 82%;
font-weight: bold;
}
#header #navigation li {
float: left;
margin:0px;
padding-right: 15px;
}
#header #navigation li a:hover {
color: #FFFF99;
text-decoration: underline;
}
#header #navigation li.tab_shop a:hover {
color: #3398CC;
}
#header #navigation li.tab_lighting a {
background: url(/images/acl_tab_left.jpg) no-repeat left top;
}
#header #navigation li.tab_lighting {
background: url(/images/acl_tab_right.jpg) no-repeat right top;
}
#header #navigation li.tab_audio a {
background: url(/images/aca_tab_left.jpg) no-repeat left top;
}
#header #navigation li.tab_audio {
background: url(/images/aca_tab_right.jpg) no-repeat right top;
}
#header #navigation li.tab_projects a {
background: url(/images/acp_tab_left.jpg) no-repeat left top;
}
#header #navigation li.tab_projects {
background: url(/images/acp_tab_right.jpg) no-repeat right top;
}
#header #navigation li.tab_northamerica a {
background: url(/images/acna_tab_left.jpg) no-repeat left top;
}
#header #navigation li.tab_northamerica {
background: url(/images/acna_tab_right.jpg) no-repeat right top;
}
#header #navigation li.tab_shop a {
background: url(/images/shp_tab_left.jpg) no-repeat left top;
}
#header #navigation li.tab_shop {
background: url(/images/shp_tab_right.jpg) no-repeat right top;
}
/* Hide from IE5-Mac \*/
#header #navigation a {
float: none;
}
/* End hide */

Does anyone have an expertise in Sliding Doors that could help me understand why IE6 doesn't like me?

Cheers,

Steve

aclighting
Offline
newbie
Last seen: 13 years 5 weeks ago
Timezone: GMT+1
Joined: 2007-09-10
Posts: 3
Points: 0

Resolved

I finally worked it out! It was the height of the a tag that was making IE unhappy, I have used padding instead and its perfectly happy now.

Steve

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 30 weeks 6 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Thanks for letting us know

Thanks for letting us know Laughing out loud

Verschwindende wrote:
  • CSS doesn't make pies