Autor Zpráva
radekt
Profil
Dobrý den,
na http://bar.nebeso.cz/ mám menu s efektem inset, aby se "vmáčkla" nabídka po najetí myší. Ale tím se zvětší rozměr menu a obsah pod ním pak odskakuje:
html:
<ul>
    <li><a href="index.php">Hlavní stránka</a></li>
    <li><a href="obsluha.php">Představení obsluhy</a></li>
    <li><a href="prostory.php">Představení baru</a></li>
    <li><a href="hry.php">Společenské vyžití</a></li>
    <li><a href="kontakt.php">Kontakt</a></li>
</ul>

<div id = "zarov_stred">
    
    <img src="pivo.jpg" alt="">

</div>

CSS:
#zarov_stred {
  text-align: center;
}

li a:hover {
  color: white;
  background-color: #669966;

  /* efekt inset */
  border-style: inset; /* "vmáčknutí" nabídky */
  border-width: 1.5px; /* hloubka "vmáčknutí" */
  /* efekt inset */

  border-right-width: 0px;
}

Dá se to řešit jinak než ostraněním efektu inset? Děkuji
juriad
Profil
Ať položka má ten rámeček vždy, jen měň jeho styl; něco jako:
li {
  border: 1.5px solid transparent; /* bude tam, ale vykresli se pruhledny = nebude videt */
}

li:hover {
  border: 1.5px inset black; /* bude mit takovy styl, jaky chces; musis zachovat sirku ramecku */
}
radekt
Profil
juriad:
Perfektní, funguje, děkuji moc.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: