Pouze tento týden sleva až 80 % na e-learning týkající se Pythonu. Zároveň využij akce až 80 % zdarma při nákupu kreditů. Více informací:
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
KiRoS
Člen
Avatar
KiRoS:9.6.2014 14:34

Ahoj mám vysouvací menu ale vše funguje ok. Akorát to vysune pod jiný blok. Zkoušel jsem z-index ale to mi nefunguje. Nevíte někdo co s tim ??

Zde je html

<div class="menu-blok">
<div class="hlavni-m">
<nav>
    <ul class="sf-menu">

<li><a href="?s=dum">DŮM</a>
 <ul>
          <li><a href="#">Zkouška </a></li>
          <li><a href="#">Zkouška </a></li>
          <li><a href="#">Zkouška </a></li>
          <li><a href="#">Zkouška </a></li>
          <li><a href="#">Zkouška </a></li>
        </ul> </li>
<li><a href="?s=zahrada">ZAHRADA</a></li>
<li><a href="?s=zvirata">PRO ZVÍŘATA</a></li>
<li><a href="?s=roubenky">ROUBENKY</a></li>
<li><a href="?s=obaly">OBALY</a></li>
<li><a href="?s=ostatní">OSTATNÍ</a></li>
<li><a href="?s=onas">O NÁS</a></li>
</ul>
</nav>
</div>
</div>

Zde je CSS

div.menu-blok
{
  width: 100%;
  height: 50px;
  position: relative;
  border-top:3px solid #8b4513;
  border-bottom:3px solid #8b4513;
  background-color: #341003;
    opacity: 0.60;
  filter:alpha(opacity=50); /* For IE8 and earlier */
}

.hlavni-m
{
  width: 1000px;
  position: relative;
  margin: 0 auto;
}

nav ul
{
  margin: 0px;
  list-style-type: none;
  padding: 0;
  color: white;
  display: block;

   z-index: auto;
}

nav ul li
{
  float: left;
  color: white;
  font-weight: bold;
  font-size: 25px;
  padding: 7px;
  margin-right: 15px;
  display: block;
   z-index: auto;
}

nav ul li:hover, .aktivni
{
  float: left;
  background: #7A421A;
  padding: 0;
  color: white;
  height: 36px;
  margin-right: 15px;
  padding: 7px;
  display: block;
   z-index: auto;
}

ul.sf-menu ul {
  position: absolute;
  left: 0;
  width: 350px;
  top: auto;
  left: -999999px;
  display: block;
  background: black;
   z-index: auto;
  }

ul.sf-menu ul a {
  zoom: 1;
  display: block;
   z-index: auto; }

ul.sf-menu ul li {
  float: left;
  width: 150px;
  display: block;
   z-index: auto; }

ul.sf-menu ul ul {
  top: 0;
  margin: 0 0 0 150px;
  display: block;
   z-index: auto;}
Odpovědět
9.6.2014 14:34
Programování a informační technologie má budoucnost.
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na KiRoS
Honza Bittner:9.6.2014 14:38

IMHO Aby ti fungoval z-index tak musíš nastavit nějakou pozici, třeba na relative. Zkus tak nastavit ten box pod menu. ;)

Nahoru Odpovědět
9.6.2014 14:38
Absolvent FIT ČVUT :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Avatar
KiRoS
Člen
Avatar
Odpovídá na Honza Bittner
KiRoS:9.6.2014 15:53

Omlouvám se ale který blok přesně myslíš :D

Nahoru Odpovědět
9.6.2014 15:53
Programování a informační technologie má budoucnost.
Avatar
Honza Bittner
Tvůrce
Avatar
Odpovídá na KiRoS
Honza Bittner:9.6.2014 15:58

Ten co ti překrývá menu, tedy nějaký main, #content, section nebo něco podobného... :)

Nahoru Odpovědět
9.6.2014 15:58
Absolvent FIT ČVUT :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 4 zpráv z 4.