195566 - CSS - float:left - wrong display due to height

Status: RESOLVED INVALID

(Core :: Layout, defect)

Description

[Uli Stärk]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.3b) Gecko/20030210
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.3b) Gecko/20030210

I found a lot of similar bugs - but none reported the same wrong behaviour (i
think :-) )

Have a look at the attachments, and you will see that the height is not
displayed correct.
It should display the blocks among each other

Reproducible: Always

Steps to Reproduce:

Comment 1

[Uli Stärk]

Attachment: HTML File appendant to the images

Comment 2

[Uli Stärk]

Attachment: Sample of Internet Explorer (correct)

Comment 3

[Uli Stärk]

Attachment: And the same displayed in Mozilla

Comment 4

[Chris Casciano]

mozilla is doing the correct thing here wrt. the w3c css reccommendations... to
get mozilla to render that page like you want it you need to define "clear" for
the element that you don't want to be cought up in your floats... in this case
change

div#contentBottom {
      width: 600px;
      height: 50px;
      background-color: green;
  }

to

div#contentBottom {
      width: 600px;
      height: 50px;
      background-color: green;
      clear:both;
  }
 

-> INVALID