wrong positioning of <div> when floating next to few other floating <div>s

VERIFIED INVALID

Status

()

Firefox
General
VERIFIED INVALID
11 years ago
11 years ago

People

(Reporter: Gai, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(URL)

(Reporter)

Description

11 years ago
User-Agent:       Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070508 Iceweasel/2.0.0.4 (Debian-2.0.0.4-1)
Build Identifier: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070508 Iceweasel/2.0.0.4 (Debian-2.0.0.4-1)

I a page where there are few <div> floating on one side (using style="float:right; clear:right" for example) trying to add another <div> that will float next to them (without the "clear") the new <div> appears in the same vertical position as the last <div> instead being placed in the same level with the top one.

See in the example page - why does the gray box so low? why doesn't it in the same height as the text to the left or the red box to the right... 

Reproducible: Always

Steps to Reproduce:
create a page like this one -
<div style="width:200px; height:200px; background:red; float:right; clear:right;"></div>
<div style="width:200px; height:200px; background:blue; float:right; clear:right;"></div>
<div style="width:200px; height:200px; background:green; float:right; clear:right;"></div>
<div style="width:200px; height:200px; background:yellow; float:right; clear:right;"></div>
<div style="width:200px; height:300px; background:#cccccc; float:right;"></div>

Actual Results:  
the gray <div> appears in the same vertical position as the yellow one

Expected Results:  
the gray <div> should appears in the same vertical position as the red one - on top

Comment 1

11 years ago
See http://www.w3.org/TR/CSS21/visuren.html#float-rules :

5. The outer top of a floating box may not be higher than the outer top of any block or floated box generated by an element earlier in the source document.

=> invalid.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 11 years ago
Resolution: --- → INVALID

Updated

11 years ago
Status: RESOLVED → VERIFIED
You need to log in before you can comment on or make changes to this bug.