I discovered an interesting bug that occurs in both IE 6 and 7 the other day. Actually, I had seen it before, but I had never been able to figure out a cause or a fix until now.

The bug occurs when you have a background set to no-repeat on an element with an undefined width. When no width is set on the element, usually because it’s inside a parent element that has a set width, the background repeats vertically in IE 6 and 7 even when the background is set to no-repeat.

The fix is easy. Obviously, if this bug occurs when no width is set on the element, simply setting a width fixes the problem. The background will no longer repeat and will show up as it is specified. There you have it!

Related Posts:

• Downgrading Web Page Layouts for IE6
• IE6 3 Pixel Float Bug
• Bizarre Empty Div Line-height Bug in IE6
• Internet Explorer Ignores Bottom Margin

This entry was posted on Monday, April 14th, 2008 at 10:53 pm and is filed under CSS, IE. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.