Misalignment on apply.php form - ie

joshuaeaston

I'm getting a strange problem on the apply.php page of the forum.

In all versions of internet explorer, there is a massive gap between the first name tag and the first name field.

It seems to work on everything except ie and aol (not that i'm too worried about aol).

Here are some screenshots:
Firefox
Internet Explorer

The only code i've edited is in English.php. I have modified the css slightly, however not any of the padding/margin settings.

Has anyone had this problem before?

Krak

lol, nice image.. Does the gap go away if you mouseover some links or scroll, or try to change text size? I noticed when making a few of my styles that things would sometimes not align correctly or simply would not show up, until I mousedover something etc. Are you using em's instead of px's? Some of my issues were due to using em's. No real idea as to what caused it though.

lech

I think I know what could be causing this as I've experienced it before when two borders were called in IE. It's a silly bug actually. If there's a border touching another border it causes that huge gap. Check your markup and see that the elements on either side of the gap don't have a border defined on the bottom (start of the gap) and on the top (end of the gap lower item). Even if the border = 0 or a color is defined that would cause it.

lech

most other browsers will ignore it, IE makes it a special case and blows open the page leaving that gap. Silly borders.

Ben

That's a nice looking style you've got there. All chocolate flavoured.

Hexus

It looks like the input elements are clearing the About div, which is floated. I've seen this happen with floats on some of my layouts before. You might try to adjust the margin-left on Form or the padding-left on the dd's. Setting a width on either of those might help also.

Bergamot

What happens when that image is smaller/not there

timberford

i'd say hexus is on the right lines about the clearing, it definitely looks like a float problem. stick float:left on whatever is containing those input forms or remove the clear:left if that's in there.