Comments on: Fieldset and Legend bug in IE8

By: Kau-Boy

Kau-Boy — Tue, 21 Dec 2010 15:35:59 +0000

Thank you a LOT! I couldn’t find why IE was doing it, no I know it! I solved it by replacing “display: none” with “visibility: hidden; height: 0″ for the legend.

By: Francesco

Francesco — Fri, 12 Nov 2010 14:49:18 +0000

My issue was that the fieldset wasn’t having the whole border rendered untill I removed display:none; from the legend, leaving us with this code:

body.ie8 #content #frmLogin fieldset legend {
display:block;
height:0;
visibility:hidden;
width:0;
}

With that, the fieldset is rendered OK

By: Prakhar

Prakhar — Mon, 11 Oct 2010 04:31:37 +0000

Hi this is the proper workaround and this wont make the legend disappear.

fieldset
{
margin: 0.8em 0px;
padding: 1em;
}

By: Ewen

Ewen — Sat, 19 Jun 2010 13:58:22 +0000

@WoBBeL,

It’s supposed to…
The CSS is meant to simulate display:hidden in order to avoid the fieldset border bug.

By: WoBBeL

WoBBeL — Sun, 13 Jun 2010 12:29:29 +0000

@Ewen,

With your CSS the legend text dissapears :P

By: Ewen

Ewen — Sat, 12 Jun 2010 12:33:24 +0000

This works without having to add any additional html

legend
{
overflow:hidden;
width:0;
height:0;
padding:0;
font-size:0
}

http://www.jainaewen.com/files/html/ie-fieldset-legend.html

By: dieMelanie

dieMelanie — Thu, 27 May 2010 11:39:01 +0000

Thanks a bunch. This problem was driving me nuts.

By: chaelli

chaelli — Wed, 14 Apr 2010 18:14:27 +0000

Thanks, I had the same problem on my website. Now it works. (: