Rowan,

I recently discovered this same problem and it is indeed a bug within the
new Firefox. Unfortunately, no one's currently working on it which means
that we're stuck using ugly solutions to fix it. I found that wraping an
extra clearing container around the original within a fieldset works. It's
definitely ugly but seems necessary at this point. So instead of

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

to clear two floating items within a fieldset, its

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

or however you're clearing your elements. Adding that wrapper container
seems to do the trick. I did manage to find a bug report of this on the
Mozilla site here:

https://bugzilla.mozilla.org/show_bug.cgi?id=309550

Hopefully this is fixed very soon.

Nick


=======================================
Nicholas Rougeux
C82.NET - http://www.c82.net
Art, the Web, and everything in between
=======================================

  

> -----Original Message-----
> From: [EMAIL PROTECTED] 
> [mailto:[EMAIL PROTECTED] On Behalf Of MountainAsh
> Sent: Thursday, January 05, 2006 3:10 AM
> To: [email protected]
> Subject: [WSG] Fieldset inclusions and possible Firefox bugs
> 
> The below code is quite simple but displays very differently 
> on Firefox 1.5 and Safari 2.0.2 (both on OSX-Tiger.) This 
> issue would probably appear different in IE too. Which 
> browser is rendering it wrong? (My opinion: Firefox)
> 
> A simple fix for Safari is to move the .buttons div inside 
> the fieldset - but I don't think this is semantically correct 
> (more so on large/complex forms with many fieldset). I don't 
> think buttons belong in the fieldset - it's for entry fields. 
> Also when the div is move an other possible FF bug is shown; 
> the buttons div does not clear and floats to the right of the 
> text fields. Does anyone have any suggestions on laying this 
> out in a "normal-ish" way using CSS?
> 
> CSS:
> 
> dt {
>         float: left;
>         clear: left;
>         width: 9.5em;
>         font-weight: bold;
>         text-align: right;
> }
> dd {
>         float: left;
>         clear: right;
> }
> .buttons {
>         clear: both;
> }
> 
> HTML:
> 
> <form action="/" method="post">
> 
> <fieldset>
> <legend>Login Details</legend>
> 
> <dl>
> 
> <dt><label for="user">Username</label></dt> <dd><input 
> type="text" name="user" id="user" /></dd>
> 
> <dt><label for="pass">Password</label></dt> <dd><input 
> type="password" name="pass" id="pass" /></dd>
> 
> </dl>
> 
> </fieldset>
> 
> <div class="buttons">
> 
> <input type="submit" value="Login" />
> 
> </div>
> 
> </form>
> 
> Thanks in advance for your insight,
> 
> --
> 
> Rowan
> http://www.rmwpublishing.net/
> ******************************************************
> The discussion list for  http://webstandardsgroup.org/
> 
>  See http://webstandardsgroup.org/mail/guidelines.cfm
>  for some hints on posting to the list & getting help
> ******************************************************
> 
> 
> 


******************************************************
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
******************************************************

Reply via email to