Autor Zpráva
Neas
Profil
Ahoj.
Řeším teď jeden malý problém:
Chtěl bych si udělat 2-úrovňové menu, tj:
<ul>
  <li><a href="#">položka</a></li>
  <li>položka</li>
    <ul>
      <li><a href="#">položka</a></li>
      <li>položka</li>
    </ul>
</ul>

jistě jste si všimli, že některé položky menu v sobě mají ještě tag <a>, jiné jej nemají. Já bych potřeboval, aby se odkazy v první úrovni menu zobrazovaly stejně, jako položky v téže úrovni bez odkazů a stejně tak jejjich :hovery aby byly stejné.
A ve druhé úrovni bych chtěl, aby znovu odkazy vypadaly stejně, jako položky bez odkazů, ale aby vypadaly jinak, než položky v první úrovni menu. A znovu také jejich :hovery aby byly stejné, ale jiné, než v první úrovni.

Když vyřeším to, aby <a> a <li> v první úrovni vypadaly stejně jak normálně, tak přo :hover, způsobí to problém, že pak vypadá stejně i <a> ve druhé úrovni. A vlastně vždy, když v tomto menu vyřeším nějaký problém, způsobím tím jiný. Po pár hodinách zkoumání a případného hledání řešení na internetu jsem dospěl k názoru, že to nejspíš dělám naprpsto špatně a proto jsem se znovu rozhodl se obrát na vás, zkušenější.

Děkuji a doufám, že můj výklad byl srozumitelný.

EDIT:

abyste se nedivili: položka v první úrovni bez <a> otevírá javascriptem druhou úroveň menu.
panther
Profil
Neas:
a:hover, li:hover {}
pro IE6 dodej hover.htc
Neas
Profil
jenže tohle přesně způsobí, že <li> a <a> vypadají stejně v obou úrovních menu.
panther
Profil
Neas:
a co třeba pro druhou úroveň přidat další styly? Druhou a další úrovně zaměříš kontextem.

li li, li li a, li li a:hover, ...?
Neas
Profil
ouvej...
právě jsem si něčeho všimnul.
Zprvu jsem myslel, že tohle přesně jsem tam měl, ale teď, když se na to dívám, opomněl jsem jeden style, který to celé svou přítomností způsoboval.
Nevadí, teď už to funguje, takže děkuju :)
Miloš
Profil
Vnořený <ul> máš mimo nadřazenou <li>. Tu nesmíš uzavírat před <ul>, ale až po něm:
<ul>
  <li><a href="#">položka</a></li>
  <li>položka <!-- TADY NIC NEUZAVÍRAT! -->
    <ul>
      <li><a href="#">položka</a></li>
      <li>položka</li>
    </ul>
  </li> <!-- a teprve tady uzavřít. -->  
</ul>
Neas
Profil
Ne, tohle mám správně, javascriptem řeším, aby se druhý seznam objevil až po kliknutí na danou položku v prvním seznamu.
panther
Profil
Neas:
to, co napsal Miloš, jsem měl taky na jazyku/klávesnici, pak jsem na to zapomněl.

javascriptem řeším, aby se druhý seznam objevil až po kliknutí na danou položku v prvním seznamu.
a co uživatelé s vypnutým JS? Ti se nedostanou vůbec na položky submenu ani na tu rodičovskou, protože ta nemá odkaz.
Miloš
Profil
Neas:
Ne, tohle mám správně,
To teda nemáš, protože tohle:
...
<li>položka</li>
<ul>

je špatně – vnořený seznam musí být uvnitř <li>. Mimo <li> nemá co dělat, protože v seznamech <ul>/<ol> nesmí být nic jiného, než <li>. A teprve uvnitř těch <li> může být jiný obsah.
Neas
Profil
jenže když to udělám, jak říkáš, nefunguje to správně..
panther
Profil
Neas:
nefunguje to správně..
...což znamená?

Z hlediska HTML je ten tvůj zápis špatně. Jestli na něm přesto trváš, klidně ho tam nech, je to přeci jen tvůj web.
Neas
Profil
na jednu stranu chci, aby byl můj veb co nejvalidnější, na druhou však bych kvůli tomu musel předělávat CSS a i bez toho to teď funguje, jak má...
panther
Profil
Neas:
aby byl můj veb co nejvalidnější
na validitě nezáleží, kvůli té se trápit nemusíš.

bych kvůli tomu musel předělávat CSS
neviděl bych to tak drasticky, jen styly týkající se menu, cca deset řádek?
Neas
Profil
pokud na validitě nezáleží, proč bych to měl měnit? takhle to funguje.

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:

0