Workaround for CSS bugs in IE5.5

[mrbinky3000]

Ive been searching the web for a workaround with an annoying IE CSS bug. You see, if you set a block element like a DIV, P, FORM or TABLE with style="width:100%" and then put another element in it with style="width:100%" like a INPUT tag, IE usually clips off the right-most few pixels.

I did some research and found an article on this site as well as several other articles that all share a similar workaround for this problem in IE 5.5

builds of IE running on OS 9 and OS X have "significant bugs"
[developer.apple.com...]

Bottom of article under resources
complete list of CSS bugs in all browsers.
commented backslash MacIE5 CSS hack and more.

Well, I'm here to tell you some unfortunate news. The commented backslash hack does not work for IE 6.0 and up.

The theory is that IE 5 can't recognize the END of a comment */ if it is escaped like so \*/

So you write a CSS definition with IE 5.5 workarounds and then re-define the same definition for all other browsers like SO...

DIV {padding-right: 10px}
/* IE 5.5 can't see the next line but all others can \*/
DIV {padding-right: 0px;}
/* End hack */

Unfortunately, the nice folks at Microsoft have fixed the \*/ bug that made this hack possible. But they didn't fix the problem with clipping off the right side of stuff contained in block elements with style="width:100%"

ARRRG!

So the only workaround I can think of is to use JavaScript, PHP, or other such scripting methods to assign a dynamic CSS sheet to the page.

Does anyone have a better workaround?

[Nick_W]

Hi,

I'm afraid I have little to offer but, maybe IE Conditional Comments [msdn.microsoft.com] might be something to look at?

nick