Weird - can anyone explain or is it just IE! (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets and Accessibility



Message


RickP -> Weird - can anyone explain or is it just IE! (9/22/2005 15:08:09)

I want a simple hover effect to work when hovering over a table cell with a link (change background). It works on every other browser but IE does what I want on the first table cell but none of the others when the code is the same for all!? Any ideas?

PAGE HERE




dpf -> RE: Weird - can anyone explain or is it just IE! (9/22/2005 15:17:32)

all 4 work exactly the same for me in IE, Rick




Giomanach -> RE: Weird - can anyone explain or is it just IE! (9/22/2005 16:00:36)

#nav td
{ 
border-top: 1px solid #FFFFFF; 
border-right: 1px solid #777777; 
border-bottom: 2px solid #777777; 
border-left: 1px solid #FFFFFF; 
width: 25%;
text-align: center;
background: #75A3D1;
}

Umm...there's your problem. CSS works as it should, it cascades through the tags, and for a change...IE is reading it properly. Try:

#nav tr td
{
border-top: 1px solid #FFFFFF;
border-right: 1px solid #777777;
border-bottom: 2px solid #777777;
border-left: 1px solid #FFFFFF;
width: 25%;
text-align: center;
background: #75A3D1;
}




RickP -> RE: Weird - can anyone explain or is it just IE! (9/22/2005 18:35:20)

Dan, I should have explained that the problem is a subtle one - the hover effect works once you mouseover the text on cells 2,3,4 but I want it to action when I hover over the cell NOT the text, which for some weird reason it does on cell one but not 2,3,4!

Giomanach, no, that doesn't make any odds - same result!
So far as I see the CSS is correct (?) and should affect all <td> elements in that table - FF, Netscape & Opera all interpret it fine!

?




Suzy. -> RE: Weird - can anyone explain or is it just IE! (9/26/2005 19:28:40)

It's a "haslayout" error by IE, (links don't accept display: block; rollovers unless they have layout). Which you can give it by adding a dimension, without hacks in this case.

You could remove the left and right padding (not required as text is centered anyway?) then you can fix it by adding width: 100%;

#nav td a
{
display: block;
text-decoration: none;
font-size:11px;
color: #333333;
padding: 5px 0;
width: 100%;
}





RickP -> RE: Weird - can anyone explain or is it just IE! (9/27/2005 6:10:09)

Thanks Suzy, this came up on another thread as the site was being critiqued and width: 100% fixed it[;)]




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.0625