Public Service Announcement: IE9 rendering oddity when FORMs tags improperly laid out

Go To StackoverFlow.com

2

Greetings and salutations!

I've put together a nice floating form CSS file for some pretty forms with minimal HTML code that work swimmingly under FF and Chrome (note the absence of IE in that list [done Done DONNNNE!]).

So in testing under IE I was getting a weird break in the FIELDSET (which was styled with a border). Under IE9 it looked as though there were 2 FIELDSETs when in fact this is only one...

JSFiddle Example

Chrome (under Win7):

Chrome

Firefox (under Win7):

Firefox

IE9 (under Win7):

Internet Exploder

UPDATE (including answer from below)

In the end, the cause of this was an end FORM being lost in the middle of the FIELDSET (as JSFiddle even complained about).

2012-04-04 04:40
by Campbeln
Please note that SO is a question and answer site -- not really a blogging platform. If you feel strongly about this content remaining on SO, please pretend you're asking a question, and then give the answer. Thanks - sarnold 2012-04-04 04:42
Fair enough! I did go looking for a "post" rather than "ask a question" link... Will note to pretend next time =) At least I used a PSA prefix - Campbeln 2012-04-04 04:45
Oh, I'm not suggesting waiting for next time -- I'm suggesting that you [edit] this to ask a question and then give an answer. : - sarnold 2012-04-04 04:46
Well... as I'm sub 100 I canna answer my own Q's without waiting 8 hours. So I'd be happy to give you the cred it you'd like to submit an answer = - Campbeln 2012-04-04 04:49
104 now! :) Go for it. (I surely don't need more. hehe. - sarnold 2012-04-04 04:51
Thanks! Answering myself feels so... dirty = - Campbeln 2012-04-04 04:52


2

It's due to the misplaced end FORM tag (even JSFiddle spotted it)!

2012-04-04 04:51
by Campbeln
Ads