PHOBOSLAB

Blog Home

IE Textarea 100% Width Bug

I recently finished work on tinyprice.de, an online community for exchanging coupon codes. The programming part was not a problem at all – just simple database I/O etc. – the layout however was quite a challenge.

Of course, the only browser making problems was Microsofts IE6. It was quite a struggle, but in the end I managed to work around every bug, without using any dirty hacks.

One particular problem I encountered, was a textarea for user comments, that had a width: 100% style. In IE6 it always spanned over the whole page, not only over the parent element. The solution I found after a lot of research, was quite simple: just wrap the textarea in a fieldset AND a div element, and everything works fine again:

<fieldset>
    <div>
        <textarea style="width: 100%;" name="content"></textarea>
    </div>
</fieldset>
Monday, October 8th 2007
— Dominic Szablewski, @phoboslab