I ran into a strange IE7 quirk in its handling of floats. I created a form where the labels and inputs are block-level elements so I can float them to be in essentially two-columns. I have used this same design before and it has worked fine. For some reason, on this site however, the first input element is getting pushed completely outside of the container off to the right. Can someone take a look and let me know if they have any ideas on how to fix this?

3 answers


Is your error only in IE? I suspect it could be the double margin bug. Try using display:inline; on elements with float defined.

Answered over 8 years ago by Divya Manian
Marcel 57

Hi Steve I didn't test it, but since you already used it successfully the same way, it must be a problem of margin, padding or the element's width. I had such problems also already, even in FF. But mostly they appear in IE because of its Margin. So i suggest to check Margin, Padding and with of all elements that could affect the form. Did you reset your CSS?

Answered over 8 years ago by Marcel

I did reset the CSS. I was thinking the same thing about Margin and Padding so I've been playing with those for a while now but no luck. That's where I got stuck. I couldn't think of what else to change that would actually fix the problem.

Answered over 8 years ago by Steve Reichgut