2 replies [Last post]
trib
Offline
Regular
London, UK
Last seen: 15 years 31 weeks ago
London, UK
Joined: 2004-03-12
Posts: 11
Points: 0

This is odd. look at this in IE, and move your mouse over the 'more info' button:

http://ab-twtc2004001.ginger.assanka.com/

If you're seeing the same as me, the space between 'coming soon' and the image is reasonable, but suddenly disappears when you mouse over the button, making the content overlap the header (which is a background image).

The CSS for the hover effect couldn't be simpler:

a.btn_moreinfo:hover {
	background: rgb(23,130,179) url('/lib/inc/imagetext/11125525525500808111510/mtbdro/more+info') no-repeat 50% 30%;
}

This wouldn't seem to me to be causing the problem, but it does trigger it. Incidentally, and possibly related, in order to make the padding a reasonable size in the first place, in IE, I had to do this:

.footer {
	padding: 80px 15px 10px 15px;
	margin: 0;
	color: white;
	clear: both;
}
* html .footer {
	padding: 40px 15px 10px 15px;
}

In Mozilla, the padding is correctly rendered as 80px, but IE doubles it and ends up with 160px, so the second selector gives IE a value which is half what I need, so it can double it and end up with the required 80px.

I get the feeling this is at the root of my problem, and it's an ugly hack in the first place, so any suggestions?

Andrew

starleos
Offline
newbie
Last seen: 15 years 29 weeks ago
Joined: 2004-03-25
Posts: 4
Points: 0

the mystery of the excess padding

Hi,

This looks to me like a peekabo bug, have a look at this page

http://www.bosh.info/css.php#peekaboo

its only a problem of the ie

regards

starleos

trib
Offline
Regular
London, UK
Last seen: 15 years 31 weeks ago
London, UK
Joined: 2004-03-12
Posts: 11
Points: 0

the mystery of the excess padding

Thanks for that - the index of CSS bugs is also very useful, it solves another problem I was having as well.