Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Hover Menu - Not displaying correctly
 
artoxicated
Jr. Member
 
Total Posts:  14
Joined:  2008-05-08
 

I’ve done a custom design for a store and for some reason the menu isn’t displaying correctly in firefox and IE7 but it does work in IE6.
I want it to display vertically as opposed to how it is showing ( see attachment.)
Also it only does this in firefox but the menu is indented, displaying almost in the center of the menu.

Any suggestions?

Image Attachments
attach.jpg
 
Magento Community Magento Community
Magento Community
Magento Community
 
darryla
Member
 
Total Posts:  52
Joined:  2008-07-08
 

Looks like a CSS problem, you might need to set clear (left), or set the width of the li a.

Can you post your CSS for ul, ul li, ul li a?

 
Magento Community Magento Community
Magento Community
Magento Community
 
artoxicated
Jr. Member
 
Total Posts:  14
Joined:  2008-05-08
 

/************** ALL LEVELS  *************/ /* Style consistent throughout all nav levels */
#nav li {
    list-style:none;
    
position:relative;
    
text-align:left;
    
}

#nav li.over { z-index:99; }
#nav li.active { z-index:98; } /* to prevent the li separator from showing through on mouseover on li */
#nav a { line-height:1.3em; }
#nav a, #nav a:hover { display:block; text-decoration:none; border:thick; color:#00CCFF;}
#nav span { display:block; cursor:pointer; white-space:nowrap; }
#nav li ul span {white-space:normal; }

#nav .level0.parent {  background: url(../images/nav_div.gif) no-repeat right ;  }

Is that what you were after?

 
Magento Community Magento Community
Magento Community
Magento Community
 
sherrie
Moderator
 
Avatar
Total Posts:  1655
Joined:  2007-12-14
Waterloo, ON
 

I would suggest making it work right in Firefox - which is very similar to IE7 - and then make a workaround for IE6.

 
Magento Community Magento Community
Magento Community
Magento Community
 
artoxicated
Jr. Member
 
Total Posts:  14
Joined:  2008-05-08
 

I guess i’ll just keep on with trial and error then, initially it was working in FF then decided not to after going for a cup of coffee! Thanks anyway smile

 
Magento Community Magento Community
Magento Community
Magento Community
 
artoxicated
Jr. Member
 
Total Posts:  14
Joined:  2008-05-08
 

This is really starting to get annoying now :( I tried changing the width, makes the menu work but the rest of the menu items get forced to move over. And unless you move your mouse really quickly the hover menu disappears. Which says to me theres a gap between the menu link and the hover menu.

If anyone feels clued up on these issues please send me a PM so i can send you the menu.css and a link to the site.

Cheers.

 
Magento Community Magento Community
Magento Community
Magento Community
 
darryla
Member
 
Total Posts:  52
Joined:  2008-07-08
 

Have you tried adding widths to the a tags, rather than li - that may resolve the hover issue smile

 
Magento Community Magento Community
Magento Community
Magento Community
 
artoxicated
Jr. Member
 
Total Posts:  14
Joined:  2008-05-08
 

Hmm that helped, still not quite right. But i’ll get it, thanks for the help =]

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top