271584 - css hovers ignored when using nested divs with float attribute

Status: RESOLVED WORKSFORME

(Core :: Layout, defect)

Description

[Phil]

User-Agent:       Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; de-DE; rv:1.7.5) Gecko/20041122 Firefox/1.0

css hovers are being ignored when using nested divs with float attribute.
code example:
<style...
.box{
float:left;
width:100px;
height:100px;
background-color:black;
}
.box:hover{
background-color:red;
}
</style>
<div> 
 <div class="box">hello</div>
 <div class="box">hello</div>
 <div class="box">hello</div>
</div>

Reproducible: Always
Steps to Reproduce:
1.
2.
3.

Actual Results:  
When moving the mouse over the box-div, nothing happens.

Expected Results:  
The background-color of the box-div should turn red when moving the mouse over 
it.

Comment 1

[Mats Palmgren (inactive)]

Attachment: Testcase

Comment 2

[Mats Palmgren (inactive)]

WFM, Firefox 1.0 and Mozilla trunk 2004-11-22-06 on Linux.

Phil, does the attached testcase work for you?

Comment 3

[Mats Palmgren (inactive)]

Attachment: Testcase #2 - Quirks mode

Aha, it does not work in quirks mode...

Comment 4

[Mats Palmgren (inactive)]

... this is intentional - see http://www.mozilla.org/docs/web-developer/quirks/
for details.

-> WORKSFORME

Comment 5

[Phil]

Attachment: I have specified the trigger of the error

the last attachment you uploaded worked, the first did not.

I have now specified the trigger of the error:
very strange: if I comment <div class="page"-layer out, the hover of the above
(not even nested!) layer works fine, if not it doesn't!
View the attachment for css

<div class="box1">
<div class="menuitem" style="width:56px;" >&nbsp; drucken &nbsp;</div>
</div> 

<div class="box1">
<div class="menuitem" style="width:70px;">&nbsp; speichern &nbsp;</div>

</div> 

<div class="page">
</div>