[CSS] float: left causes firefox to mess up positioning

RESOLVED INVALID

Status

()

RESOLVED INVALID
13 years ago
13 years ago

People

(Reporter: tjoppetja, Unassigned)

Tracking

Trunk
x86
Windows 98
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(URL)

Attachments

(3 attachments)

(Reporter)

Description

13 years ago
User-Agent:       Mozilla/5.0 (Windows; U; Win98; nl-NL; rv:1.7.7) Gecko/20050414 Firefox/1.0.3
Build Identifier: Mozilla/5.0 (Windows; U; Win98; nl-NL; rv:1.7.7) Gecko/20050414 Firefox/1.0.3

When four blocks are sorted in a square of two blocks on the first row and two
blocks on the second row (as on http://dopes-planet.com/~flash/bugs/div.htm,
with the "blocks" represented as <div>'s) using the float: left CSS rule for the
left boxes, firefox renders the top-left box correctly, the top-right box
beneath the top-left box instead of next to it, the bottom-left box is rendered
correctly again, and the bottom-right box seems to be rendered on top of the
bottom-left box, but its content is beneath the bottom-left box.
On Internet Explorer 5.5 and Opera 8.0 the boxes are rendered as they should be
rendered, as can be seen on the second attachment. I couldn't check if this bug
also occurs on other platforms.

Reproducible: Always

Steps to Reproduce:
1. Go to http://dopes-planet.com/~flash/bugs/div.htm with Firefox
2. Go to http://dopes-planet.com/~flash/bugs/div.htm with IE or Opera
3. Compare

Actual Results:  
The boxes were rendered incorrectly as described erlier: the left boxes were
rendered correctly, but the top-right box was on top of the bottom-left box and
the bottom-right box was rendered partly on top, partly beneath the bottom-left box.

Expected Results:  
It should have rendered the four boxes in two rows of two boxes.

Using Windows 98SE and Mozilla/5.0 (Windows; U; Win98; nl-NL; rv:1.7.7)
Gecko/20050414 Firefox/1.0.3.
(Reporter)

Comment 1

13 years ago
Created attachment 186352 [details]
The wrongly positioned boxes in Firefox
(Reporter)

Comment 2

13 years ago
Created attachment 186353 [details]
The boxes again, correctly positioned in IE

Updated

13 years ago
Component: General → Layout
Product: Firefox → Core
QA Contact: general → layout
Version: unspecified → Trunk
(Reporter)

Updated

13 years ago
Component: Layout → Layout: Floats
The CSS spec says that floats displace lines but do not displace blocks (at
least blocks that don't establish new block formatting contexts).  IE's
distinction between types of blocks is triggered by use of 'height' or 'width',
which is incorrect.
Status: UNCONFIRMED → RESOLVED
Last Resolved: 13 years ago
Resolution: --- → INVALID
(Reporter)

Comment 5

13 years ago
We could argue about that, and maybe you're right. But even then Firefox
shouldn't render the individual blocks on top of each other.
You need to log in before you can comment on or make changes to this bug.