Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

z-index does not affect my div

Home › Forums › Older releases › 1.0.x › z-index does not affect my div

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • February 18, 2016 at 04:05 #3039
    ratmalwer
    Participant

    I try to overlay the red square over the menu in this example.
    Having only two divs it works.
    Having the main-menu in the div it does not work.
    I tryed increasing z-index up to 222222 or more…

    <style>
#nav_menu {
	position:relative;
}
#aa {
	float:left;
	background-color:green;
	height:200px;
	width:400px;
	z-index:1;
}

#bb {
	float:left;
	width:50px;
	margin-left:-50px;
	height:60px;
	background-color:red;
	z-index:222222 !important;
}
#cc {
	clear:both;
}
</style>

</head>
<body>
<!---  example without menu --->   
<div id='nav_menu'>
   <div id='aa'>
		aa
   </div>
   <div id="bb">
		bb
   </div>
</div>
<div id="cc">
  <p>some Text ...</p>
</div>   
<!---  example with menu --->   
<div id='nav_menu'>
   <div id='aa'>
      <ul id="main-menu" class="sm sm-horizontal sm-mk">
        <li><a href="#">Item 1</a></li>
        <li><a href="#">Item 2</a>
          <ul>
            <li><a href="#">Item 2-1</a></li>
            <li><a href="#">Item 2-2</a></li>
            <li><a href="#">Item 2-3</a></li>
          </ul>
        </li>
        <li><a href="#">Item 3</a></li>
      </ul>
   </div>
   <div id="bb">
		bb
   </div>

</div>
<div id="cc">
  <p>some Text ...</p>
</div>
    February 18, 2016 at 04:17 #3040
    ratmalwer
    Participant

    February 22, 2016 at 14:41 #3050
    admin
    Keymaster

    z-index only works if you set position too – e.g.:

    #bb {
	position: relative;
	z-index: 222222;
}

    The default SmartMenus z-index defined in “sm-core-css.css” is 9999 so anything above that should work if you are coding your CSS properly.

    February 23, 2016 at 15:09 #3062
    ratmalwer
    Participant

    Great! its always the littel things…
    Thanks!!!

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘1.0.x’ is closed to new topics and replies.