Peculiarity with forms and CSS in IE 7  
Author Message
Rex Racer





PostPosted: Internet Explorer Web Development, Peculiarity with forms and CSS in IE 7 Top

I'm not sure if this was something peculiar to my page, or if it is a widely known thing, but I thought I would post it here on the off chance that it might help someone.

If you have a <form> tag somewhere on the page other than right below the <body> tag, IE 7 may insert an extra line break before the <form> tag. For example:

<body>

...other html and content...

<div id="banner" align="center">

<img src="images/TAMUBanner.jpg" alt="Texas A&M Banner" />

</div>

<form id="form1" runat="server">

...other html and content...

</form>

...other html and content...

</body>

IE 7 will put an extra line break between the </div> and the <form id="form1" runat="server">. This bug was also present in previous versions of IE.

You cannot use hacks such as putting html>body in front of the CSS properties for the form to fix this because that will affect Firefox and other non-IE browsers, and these non-IE browsers do not have the same flaw. So positioning in non-IE browsers would be thrown off.

To fix this, you need to move the opening <form> tag up to the top of the page, right beneath the <body> tag, if possible. That way there will not be an extra line break in the middle of your content. For example:

<body>

<form id="form1" runat="server">

...other html and content...

<div id="banner" align="center">

<img src="images/TAMUBanner.jpg" alt="Texas A&M Banner" />

</div>

...other html and content...

</form>

</body>



Internet Explorer Development7