Products

Solutions

Resources

Partners

Community

Blog

About

QA

Ideas Test

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...solpartmenu z-indexsolpartmenu z-index
Previous
 
Next
New Post
9/2/2011 12:32 AM
 
My dropdown menu being covered by the content in HTML module on my site.

I know there are problems with just using the position:"absolute," but I wrapped all of the content  in a div with the position set to "relative".

I really think that this is a skin issue, because I used z-index="1" and z-index="2" in the HTML module.

There are no "z-index" settings on my skin.css file for the menu. 

Can I just add
z-index: 3;
on the submenu items in the skin.css file to fix this?
 
New Post
9/2/2011 8:58 AM
 
Hey Jessica,

I haven't used the Solpart menu in years but it sounds like the problem is related to CSS for sure.

There are a few things to keep in mind when using z-index:

1. An element with z-index must always have the position defined (ie. "z-index:3; position:relative;")
2. Usually, you need to define the z-index for both elements. So if you have "div id nav" and "div id content" for example, you should define #nav {position:relative; z-index:3;} and #content {position:relative; z-index:2;} This way, any element within #nav will overlay anything in #content
3. Z-index is inherited. So if you have two elements #nav and #content, even if you apply a high z-index (let's say 99) to your submenus, if your parent element #nav is a lower z-index than content, it's still not going to overlay the #content because #content is still a higher z-index.

So my overall advice is to get Firefox's Web Developer extension, go to Edit CSS, and try applying {position:relative; z-index:3} to your different tags and play around with it.

Let me know how it goes. If you can provide a link or a screenshot I might be able to help more.

Also, food for thought, have you considered upgrading to DDR Menu? (http://www.dnngarden.com/) Highly suggested.

Aaron
 
New Post
9/2/2011 12:28 PM
 
I had the same problem only on IE9 and resolved it by changing my skin.css from:
.MainMenu_SubMenu {
 z-index: 1000;
 cursor: pointer;
 cursor: hand;
 margin: 2px 0px 0px 0px;
 background-color: #F3F3F3;
 border: 1px solid #c7c7c7;
 padding: 0px;
 filter: progid:DXImageTransform.Microsoft.Shadow(color='#dddddd', Direction=135, Strength=3) ;
}
to:
.MainMenu_SubMenu {
 z-index: 1000 !important;
 cursor: pointer;
 cursor: hand;
 margin: 2px 0px 0px 0px;
 background-color: #F3F3F3;
 border: 1px solid #c7c7c7;
 padding: 0px;
 filter: progid:DXImageTransform.Microsoft.Shadow(color='#dddddd', Direction=135, Strength=3) ;
}
Thanks,
Greg Hart
 
New Post
9/8/2011 9:37 PM
 
Thanks guys.

I finally figured it out. Just a really simple, stupid fix.

All I had to do was give the div that I had wrapped around all of the content a z-index:0;

Thanks for your suggestions though, I appreciate it.
 
New Post
10/14/2011 12:39 PM
 
Thank you @G Hart. Adding "!important" to the z-index worked for me. I upgraded to DotNetNuke 6.00.02 recently and my sub-menus were behind the content text and the sub-menus could not be clicked. Using the the Firefox debugger I did see that the z-index was being overridden by a style applied to the sub-menu div tag.
 
Previous
 
Next
HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...solpartmenu z-indexsolpartmenu z-index


These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

  1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
  2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
  3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
  4. No Flaming or Trolling.
  5. No Profanity, Racism, or Prejudice.
  6. Site Moderators have the final word on approving / removing a thread or post or comment.
  7. English language posting only, please.
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out
What is Liquid Content?
Find Out