Site Navigation

Friday, August 24, 2007

bug 101 - buttons render stretched and distorted in IE (WinXP)

Issue: #101
Affects: IE6, IE7 (on WinXP)
Fixed in: IE8 Beta 1

On Windows XP in IE6 or IE7, with the default themes applied the input button element renders stretched and distorted when the length of the value exceeds 17 characters.

In fact, the padding on the button also changes, depending on the length of the value attribute, which is also a buggy.

<input type="button" name="test" value="Distorted in IE on XP" onclick="alert('How do I look?');"/>

View this page in Windows XP in IE6 or IE7 to see the rendering bugs.

You don't even have to use Windows XP to see the padding expansion bug. IE6 on Windows2000 or Windows2003 will also display the issue.

Known Workarounds: CSS Hacks.

Example Workaround Code:

Related Issues: None.