Floated LI displayed in unstandard way

RESOLVED DUPLICATE of bug 320610

Status

()

Firefox
General
RESOLVED DUPLICATE of bug 320610
12 years ago
12 years ago

People

(Reporter: SasQ, Unassigned)

Tracking

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

12 years ago
User-Agent:       Opera/8.51 (Windows NT 5.0; U; en)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; pl; rv:1.8) Gecko/20051111 Firefox/1.5

Suppose we have three list items <li> and apply "float: left;" to first of them. W3C says that floated box is taken out of normal flow, and the rest of the page shifts up to take his place. The float have to be displayed over the other boxes, only the line-boxes don't hide under the floated box.
In the case of that floated LI, the other LI boxes didn't hide, but takes place by the float's side. This looks like unstandard way. The boxes of elements like DIV hides hormally under the flotat, and only their inline content sets on the side of the float.

The code to reproduce this:

XHTML:
<ul id="NaviTop">
  <li class="Prev"><a href="#">Precious</a></li>
  <li class="Next"><a href="#">Next</a></li>
  <li class="Cont"><a href="#">Contents</a></li>
</ul>

CSS:
#NaviTop { list-style: none;  margin: 0px;  padding: 0px; }
#NaviTop .Prev { float: left; }
#NaviTop .Next { background: #080; }
#NaviTop .Cont { background: #00F; }

With this style the backgrounds should be displayed under the floated LI's box, and the inline contents [links] placed on the side. But the backgrounds don't stretch under the floated LI.

Reproducible: Always

Steps to Reproduce:
1. Make a list with some <li>'s
2. Set background colors for the other list items.
3. Float one list item left or right.

Actual Results:  
The other list items' backgrounds don't stretch under the floated LI's box. This is standards uncompliance, because every floated box have to be taken out from the normal flow, and the boxes following it should behave like if that float wasn't there - stretch to the full width, and only their inline content shouldn't hide under the floated box.

Expected Results:  
Only the inline content of the other LI's shouldn't go under the floated LI. The LI boxes containing it should behave like if there wasn't any box, and stretch on the full width, even under the floated LI's box. Just like with other floated boxes!

In other browsers, like Opera 8.5, and EVEN INTERNET EXPLODER 5.0(!!!), this is displayed correctly. Why not in Firefox? :P

*** This bug has been marked as a duplicate of 320610 ***
Status: UNCONFIRMED → RESOLVED
Last Resolved: 12 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.