291118 - Layout problems created by use of background-image property in DIV tag css style

Status: RESOLVED INCOMPLETE

(Core :: Layout, defect)

Description

[Jonathan Allenby]

User-Agent:       Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)
Build Identifier: Mozilla/5.0

There are three styles that are applied to top level menu DIV tags that are 
dynamically written out from javascript (part of the dynamic popup menu bar). 
When a sub menu is popped open, if you rollover a sub-menu item that itself 
has a child menu, then the display is broken by the item seemingly inheriting 
background-image properties from the top level items.

This should not happen as the styles including the background-image property 
are not those used by the sub-items, which have a non-graphical style. The 
lower level popup menus (DIV tags) are not nested within the higher level 
items (DIV tags).

You can see the correct layout if you use IE6 to browse the page.

The three top-level styles are included below for your reference.



.MainMenu_MenuItem_TopLevel {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	vertical-align: middle;
	background-color: #336799;
	padding-top:4px;
	padding-bottom:5px;
	padding-left: 20px;
	padding-right: 8px;
	cursor: pointer;
	background-image: url(/ukpia/Portals/0/nav_bar_arrow_off.gif);
	background-repeat:none;	
	float:left;
}

.MainMenu_MenuItemSel_TopLevel {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #002141 ;
	background-color: #F5EAE4;
	vertical-align: middle;
	padding-top:4px;
	padding-bottom:5px;
	padding-left: 20px;
	padding-right: 8px;
	cursor: pointer;
	background-image: url(/ukpia/Portals/0/nav_bar_arrow_on.gif);
	background-repeat:none;	
	float:left;
}


.MainMenu_MenuItemCurrSel_TopLevel {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #002141 ;
	background-color: #E4EDF4;
	vertical-align: middle;
	padding-top:4px;
	padding-bottom:5px;
	padding-left: 20px;
	padding-right: 8px;
	cursor: pointer;
	background-image: url(/ukpia/Portals/0/nav_bar_arrow_currsel.gif);
	background-repeat:none;	
	float:left;
}

Reproducible: Always

Steps to Reproduce:
1.Navigate to http://ukpia.server-hosting.org.uk (I am developing this site, 
so it will be around for a while)
2.Rollover "Industry Issues" in the nav bar - this will popup a sub-menu
3.In the sub-menu rollover "Environment" 

Actual Results:  
The layout goes wrong

Expected Results:  
The lower level sub menus should be rendered without arrows as background 
images - you can see what should happen by repeating these steps using IE6.

I have looked on newsgroups and note that this problem is certainly not unique 
to this site.

Comment 1

[José Jeria]

Could you please attach a minimized (as small as possible) testcase showing this
issue?
https://bugzilla.mozilla.org/attachment.cgi?bugid=291118&action=enter

Comment 2

[Boris Zbarsky [:bzbarsky]]

I doubt background-image is involved.  More likely the problem is that you're
floating table rows or table cells, which means they stop being table rows or
table cells...

Comment 3

[Gervase Markham [:gerv]]

This is an automated message, with ID "auto-resolve01".

This bug has had no comments for a long time. Statistically, we have found that
bug reports that have not been confirmed by a second user after three months are
highly unlikely to be the source of a fix to the code.

While your input is very important to us, our resources are limited and so we
are asking for your help in focussing our efforts. If you can still reproduce
this problem in the latest version of the product (see below for how to obtain a
copy) or, for feature requests, if it's not present in the latest version and
you still believe we should implement it, please visit the URL of this bug
(given at the top of this mail) and add a comment to that effect, giving more
reproduction information if you have it.

If it is not a problem any longer, you need take no action. If this bug is not
changed in any way in the next two weeks, it will be automatically resolved.
Thank you for your help in this matter.

The latest beta releases can be obtained from:
Firefox:     http://www.mozilla.org/projects/firefox/
Thunderbird: http://www.mozilla.org/products/thunderbird/releases/1.5beta1.html
Seamonkey:   http://www.mozilla.org/projects/seamonkey/

Comment 4

[Matthias Versen [:Matti]]

The URL is dead, is there a new testcase somewhere ?

Comment 5

[Paul Booker]

Please reopen if there is a new test case for this bug.

Best, Paul