Autor Zpráva
astek
Profil
Ahoj,
obracím se na vás opět s prosbou. Stukruta html je takováto:
<div id="menu">
    <ul>
<li><div class="hoverright"></div><a href="index.php">O společnosti</a></li>
        <li><div class="hoverright"></div><a href="garanti.php">Garanti</a></li>
   </ul>
</div>
div.hoverright má primárně display:none; , při najetí na <a> potřebuji, aby se pomocí hover zobrazil div.hoverright
Ale problém je, že nevím, co zapsat k hoveru. Zkoušel jsem:
div#menu ul li a:hover div#menu ul li div.hoverright
{
    display:block;
    background-color:black;
    width:10px;
    height:20px;
}
Ale nic se nezobrazilo. Přitom když napíšu
div#menu ul li div.hoverright
{
    display:block;
    background-color:black;
    width:10px;
    height:20px;
}
Tak se černý obdélníček v pohodě zobrazí.
A konečně otázka: Co napsat k hoveru, aby to fungovalo? JS se mi to řešit nechce, ale když to nepůjde jinak, asi mi nic jiného nezbude.
Děkuji za rady.
Chamurappi
Profil
Reaguji na astka:
Zaměřit pomocí CSS selektoru předcházejícího sourozence nejde.
Proč nemůže být ten <div class="hoverright"> uvnitř odkazu?
margin
Profil *
Já bych to napsal nějak takto:
<style>
#menu a span  {display: none;}
#menu a:hover span  {display: block;}
</style>
<ul id=menu>
    <li><a href="/"><span></span>O společnosti</a></li>
    <li><a href="garanti.php"><span></span>garanti.php</a></li>
</ul>
Pokud je pro tebe výhodnější a přehlednější tvůj systém zápisu, klidně si to uprav.

Pokud nechceš měnit svůj HTML kód, tak v CSS nejde docílit požadovaného chování, protože element, který chceš zobrazit, není uvnitř odkazu. Možná ti bude stačit toto:
#menu li:hover div.hoverright {display:block; /* atd... /*}
astek
Profil
Pomohlo přesunutí do <a> + předělání na <span>.
Teď už to jen napsat, aby se to krom chromu, firefoxu a dalších zobrazovalo korektně v IE a Opeře.
Ale s tím už si poradím.
Děkuji mnohokrát Vám oboum.

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: