Posted by fred.haab@gmail.com on 06/13/06 00:49

Here's a page with a sample login:
http://frhaab.home.comcast.net/test/prob1.html

Ignore the part about centering.

The page is pretty self explanatory, but for archival purposes I'll
reiterate it here. The CSS is shown on the page I linked to above, but
the important part... the "clear" class, is really the only important
tag, and it just has "clear: both" set.

<form>
<div class="login border bg">
<div class="clear">
<div class="login-text">Username:</div>
<div class="login-input"><input type="text" name="username" /></div>
</div>
<div class="clear">

<div class="login-text">Password:</div>
<div class="login-input"><input type="password" name="password"
/></div>
</div>
<div class="clear">
<div class="login-text">&nbsp;</div>
<div class="login-input"><input type="submit" value="login" /></div>
</div>
</div>
</form>

Long story short, the login button is displayed beneath the outer login
div on both Firefox and Opera, and that seems counter intuitive to me.

IE displays it how I think it would be displayed.

The work-around is to add another empty div:

<div class="clear"></div>

After the submit button div, and before closing the outer div. This
displays correctly on all browsers. The question is why. I want to
know if I'm wrong, or if Firefox and Opera are wrong.

• Next in forum: Re: Matt's Form Mail.pl
• Prev in forum: Re: Single Quote Versus Double Quote In A href link
• Thread view: Nested div display problem with IE and Firefox.

[Reply to this message]