Fieldset - IE 7 problem

**_Nikhil** · Sep 4, 2012 10:26

The fieldset does not center align in IE7 and when there are more of them the top one goes off to the right
This works well in IE8 , chrome & firefox. Any ideas for the css? I have lots of pages using this kind of structure so can't really change the HTML now.
I need this working in IE7 & I can't use fixed widths.

Thanks in advance.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style type="text/css">
#Container {width:90%;border:solid black 1px;margin-left:auto;margin-right:auto; }
.FieldGroup{width:90%; margin-top:20px; margin-left:auto;margin-right:auto;}
</style>
</head>
<body>
<div id="Container">    
   <fieldset class="FieldGroup"><legend>Field 1</legend>
            <p>First field set content</p>
   </fieldset>
   <fieldset class="FieldGroup" ><legend>Field 2</legend>
            Second field set content</p>
   </fieldset>
</div>
</body>
</html>

**_Nikhil** · Sep 6, 2012 12:18

Never mind.
I am putting a temporary fix for now by adding conditional stylesheet for IE7 & using fixed margin on the left. Atleast it looks decent.

**Rayzur** · Sep 6, 2012 15:16

Hi,

Since you have a 90% width and auto margins you can set the fieldset as display:block to fix IE7.
No need for a conditional stylesheet.

Code:

.FieldGroup {
    display:block;
    width: 90%;
    margin: 20px auto 0;
}

**_Nikhil** · Sep 7, 2012 10:32

Thanks a lot. That works great.

User Tag List

Thread: Fieldset - IE 7 problem

Thread Tools

Display

Fieldset - IE 7 problem

Bookmarks

Bookmarks

Posting Permissions