Autor Zpráva
gully
Profil
Ahoj všem,

protože nejsem vůbec kovaný v CSS, chtěl bych vás - zkušené - poprosit o pomoc s vystylováním horizontálního menu na stránkách http://kkbabice.cz. Konkrétně bych potřeboval pomoct se dvěma věcmi.

1. Potřeboval bych, aby u aktivního menu zůstal svítit ten oranžový proužek, co je naspodu.
2. Položky submenu bych chtěl mít těsně pod sebou, navzájem oddělené jedinou tenkou čárou (teď jsou tam dvě čáry, které jsou odsazené od sebe).

Za případnou pomoc předem velké díky.
jefitto44
Profil
1. Toto je vec skorej PHP, potrbeuješ si nejakým spôsobom porovnať, či href daného odkazu je zhodný s $_SERVER[REQUEST_URI], alebo self, alebo niečo podobné a ak áno, priradíš <li> triedu selected napríklad a tú si potom naštýluješ v CSS (ul li:hover, ul li.selected)
gully
Profil
Aktivnímu menu přiřazuji class="active"
<ul class="nav">
    <li>
        <a href="index.php">Domů</a>
    </li>
    <li>
        <a href="kurzy.php"><div class="prefered_menu_item">Kurzy</div></a>
    </li>    
    <li>
        <a href="seminare.php"><div class="prefered_menu_item">Semináře</div></a>
    </li>
    <li>
        <a href="akce.php"><div class="prefered_menu_item">Akce</div></a>
    </li>    
    <li>
        <a href="galerie.php" class="active">Galerie</a>
    </li><li>
                    <a href="moje_kk.php"><div class="registered_menu">Moje KK</div></a>
                  </li><li>
                    <a href="forum.php"><div class="registered_menu">Fórum</div></a>
                  </li> 
    <li>
        <a href="kkbabice.php">KK Babice</a>
        <ul>
            <li><a href="kkbabice.php#info">Základní informace</a></li>
            <li><a href="kkbabice.php#instruktori"></a></li><li><a href="kkbabice.php#instruktori">Instruktoři výcviku</a></li>
            <li><a href="kkbabice.php#mapa"></a></li><li><a href="kkbabice.php#mapa">Místo výcviku</a></li>
            <li><a href="kkbabice.php#loga"></a></li><li><a href="kkbabice.php#loga">Loga &amp; reklama</a></li>
            <li><a href="kkbabice.php#reklama"></a></li><li><a href="kkbabice.php#reklama">Členové</a></li>
        </ul>    
    </li>    
    <li>
        <a href="kontakty.php">Kontakty</a>
    </li>
    </ul>
Trejpa
Profil
gully:
Aktivnímu menu přiřazuji class="active"
V tomto případě, pokud máš možnost, ji raději přiřazuj položce seznamu, než odkazu.
Bubák
Profil
gully:
1. „Aktivnímu menu přiřazuji class="active"
V CSS deklaruješ dolní rámečky v souboru http://kkbabice.cz/css/main_menu.css na řádku 76 položkám seznamu, takže dej v HTML třídu active položce seznamu. Kvůli této změně bude nutné změnit selektor na řádku 174 z .nav li .active třebas na .nav li.active.
Obdobně selektor pro červenou barvu textu aktivní položky, .nav li .active na .nav li.active a, důrazně doporučuji vyhodit !important.

Alternativně je možné změnit HTML a CSS tak, že dolní orámování budou mít samotné odkazy, já jsem zvyklý to tak dělat (hover fungoval v IE6 jen na odkazech), ale to by znamenalo o něco málo vice úprav v CSS.

2. Nechápu, proč máš v podmenu 2× za sebou týž odkaz, jednou prázdný a hned za ním s textek odkazu. To způsobuje zdánlivě podivné chování podmenu.
<li><a href="kkbabice.php#instruktori"></a></li><li><a href="kkbabice.php#instruktori">Instruktoři výcviku</a></li>
gully
Profil
Už to funguje :) Díky moc!

edit: (nevšimnul jsem si předchozího příspěvku od Bubáka)

Bubák:
2. Nechápu, proč máš v podmenu 2× za sebou týž odkaz, jednou prázdný a hned za ním s textek odkazu. To způsobuje zdánlivě podivné chování podmenu

Ty myslíš ten kód, co jsem napsal výše. To byla jenom chyba, která je už opravená.

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: