On Jan 10, 2006, at 3:18 PM, yaXay wrote:

> Hello,
>
>>> I'm applying the clearfix to a div that contains a label and a input 
>>> field. I'm floating the label to the left and the input field to the 
>>> right. For some reason the clearing does not work on this (FF1.5). 
>>> When I remove the "input { float: right; }" it does.. why?
>>>
>>> Example: http://yaxay.ya.funpic.de/clearfix.html (I'm sorry for the 
>>> ad, it's not mine..)
>>>
>> When I view the page in FF1.5, I see the same thing that IE6/winxp is
>> showing me.  I tried deleting the "input float right" but nothing
>> changed.  Have you managed to fix this?
>>
> my mistake; I should have mentioned, I only checked FF1.5 and Opera9.0
> (I know it's not final yet..). But still, shouldn't the "[further form
> fields..]" be in the next line? For some reason -- that I'd really like
> to know -- the Computed Style shows 0px for the height of the 
> containing
> div. Is it supposed to be that way?

Because both the label and input are floated, the div has no content so 
its height becomes 0.

I think you found a ff1.5 bug.  Opera and safari display as you would 
expect.  Apparently my firefox settings and extensions from 1.5 are 
making 1.07 unhappy.  I'll have to rectify that later.   The upshot is 
that I can't tell for sure if ff1.07 has this bug or not (1.6a1 does).

If you were to change the css for fieldset>div:after so you could see 
it,

fieldset>div:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: visible;
        border-top: 1px solid red;
}

You will notice that in ff1.5, The 'clearer' generated content for the 
first div is actually displayed above the text of the first div 
(because the floated elements overflow). However, the 'clearer' 
generated content for the second div is below it as you would expect.

There are several fixes.  Probably the simplest in your case is

fieldset>div:before {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
}

The second simplest is to give fieldset>div a min-height of 1.2em.

hth
-- 
Roger Roelofs
"Remember, if you’re headed in the wrong direction,
        God allows U-turns!"
          ~Allison Gappa Bottke
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to