ross dickinson: web and desktop software developer

IE7 Adds White Space and Line Breaks After Hidden Input Fields

by Ross on November 30, 2011 at 12:39 PM under

If you've ever worked with hidden fields in IE7, you may have stumbled across this when viewing code like this:

<form>
    <input type="hidden" />
    <span>Hi, I'm text!</span>
</form>

You expected to see this: But you end up with this:
Hi, I'm text!
Hi, I'm text!

This is due to a bug with how IE7 handles hidden input tags directly inside a form element. For whatever reason, when IE7 sees a hidden input tag with any white space or line breaks between the end of its tag and the beginning of the next tag, it adds an empty line to the rendered version. This seems to only effect direct descendents of the form element, though.

You can fix this in a few ways:

  1. The "Hacky Fragile" way: Remove any white space between the hidden input tag and the next tag.
  2. The "Meh" Way: Put all your hidden inputs at the end of the form tag.
  3. The "Recommended" way: Wrap the hidden inputs inside of another tag, like a div.

Add comment

biuquote
  • Comment
  • Preview
Loading

About the author

rossisdead is a 26 year old web and desktop software developer from New Jersey. He has two cats and likes long walks on the beach.

On Stackoverflow

On Stackoverflow Careers

On Codeplex

On Github