CSS - jak na formát pomocí ID

Webdesign, HTML, CSS, Flash, PHP, ASP, .NET, JavaScript. Kritika www stránek na Smetišti.

Moderátor: Moderátoři Živě.cz

Odeslat příspěvekod windsurfeeer 12. 2. 2007 09:50

Mám menu formátované pomocí CSS a aktivní položka má navíc parametr ID. Jak mám nastavit CSS aby se aktivní položka zobrazovala jinač než ostatní?

Kód: Vybrat vše

Aktivní položka:
<a href="http://..." class="mainlevel" id="active_menu">Odkaz1</a>
Neaktivní položka:
<a href="http://..." class="mainlevel">Odkaz2</a>
[/co
SS pro mainlevel v levém sloupci
Kód: Vybrat vše

#left .mainlevel {
  font-weight: bold;
  font-size: 10px;
  text-decoration: none;
  display: block;
  _width: 100%;
}


Nevím jak mám napsat ten první řádek CSS (začínající kříčkem) aby se to odkazovalo na active_menu, tedy aby Odkaz1 měl například font-size: 20px; zatímco Odkaz2 má 10px?


Děkuji.
windsurfeeer
Junior

Odeslat příspěvekod Christof 12. 2. 2007 10:13

#active_menu {}
Christof
Junior

Odeslat příspěvekod windsurfeeer 12. 2. 2007 10:26

Díky, ale žádná změna. Přidal jsem do css tohle:
Kód: Vybrat vše
#active_menu {
  font-size: 20px;
}
windsurfeeer
Junior

Odeslat příspěvekod anonymni 12. 2. 2007 11:02

skus
Kód: Vybrat vše
.active_menu {
  font-size: 20px;
}
anonymni

Odeslat příspěvekod windsurfeeer 12. 2. 2007 11:14

právě že různé varianty typu:
.active_menu
#active_menu
#left .active_menu
#left active_menu
#left mainlevel.active_menu
#left mainlevel.active_menu
mainlevel .active_menu
atd.

jsem bezúspěšně zkoušel. Ale protože nechápu přesně syntaxi těch křížků a teček tak jsem asi nenarazil na správnou kombinaci. :(

Celé je to v <div class="left"> jakože levý sloupec. V něm je klasická navigace dělaná tabulkou. Uvnitř tabulky je na každém řádku tabulky v samostatném <tr><td></td></tr> jeden odkaz. Každá položka tabulky má <a class="mainlevel"> a jen ten aktivní odkaz má <a class="mainlevel" id="active_menu">.
windsurfeeer
Junior

Odeslat příspěvekod charlie42 12. 2. 2007 11:17

#active_menu .mainlevel
charlie42
Kolemjdoucí
Uživatelský avatar

Odeslat příspěvekod anonymni 12. 2. 2007 11:34

nebolo by lepsie zmenit rovno class?
anonymni

Odeslat příspěvekod windsurfeeer 12. 2. 2007 11:38

#active_menu .mainlevel taky ne :( Už to vypadá jakobych editoval jiné css, ale když zedituju jiný parametr, tak se mi to ve stránce projeví, tudíž chyba je jinde.

Ale teď jsem si všimnul že ten první div má ID=left a ne class=left jak jsem napsal výše. Takže mám uvnitř ID=left další samostatný tag s ID=active_menu. Nemůže se tohle dvojité IDiotství nějak ovlivňovat?

Jestli jsem to pochopil správně, tak v css souboru před název ID se dává křížek a před názvem class je tečka. A když je to bez ničeho, jde o název tagu. Yo?
windsurfeeer
Junior

Odeslat příspěvekod anonymni 12. 2. 2007 11:40

skus si precitat http://www.jakpsatweb.cz rubriku css
ale ja osobne by som rovno menil cele class pomocou php
anonymni

Odeslat příspěvekod windsurfeeer 12. 2. 2007 11:40

hicotech píše:nebolo by lepsie zmenit rovno class?


Nechci hackovat php kód. Jde o CMS Joomla a když bych udělal upgrade, tak bych o ten hack zas přišel.
windsurfeeer
Junior

Odeslat příspěvekod anonymni 12. 2. 2007 11:45

a oni to tam nemali vyriesene?
anonymni

Odeslat příspěvekod Kyosuke 12. 2. 2007 11:53

*#active_menu
Kyosuke
Junior

Odeslat příspěvekod Kyosuke 12. 2. 2007 12:01

Ale je to divné, i #active_menu by mělo fungovat a mělo by mít maximální prioritu. Jaký prohlížeč používáš? Debugnout to můžeš pomocí Firefoxu a Web Developer toolbaru – myslím, že umožňuje zobrazit celou kaskádu.
Kyosuke
Junior

Odeslat příspěvekod windsurfeeer 12. 2. 2007 12:03

Už jsem zjistil, kde je problém:
class přebíjí hodnotu ID, tedy když mám nastaveno v class font-size: 10px a v ID font-size: 20px, tak se použije těch 10. Takže nová otázka:

Lze nějak upřednostnit ID před CLASS?

Edit: FF zkusím doma, tady jedu na IE, resp. SlimBrowseru který využívá IE. *#active_menu ani *#active_menu .mainlevel taky nepomáhají. Chjo...
windsurfeeer
Junior

Odeslat příspěvekod Kyosuke 12. 2. 2007 12:11

Máš něco rozbitý, protože ID přebíjí hodnotu class. ;-)
Kyosuke
Junior

Odeslat příspěvekod Kyosuke 12. 2. 2007 12:19

Jinak by bylo dobrý hodit aspoň link, abychom se mohli přesvědčit, kde je opravdu problém.
Kyosuke
Junior

Odeslat příspěvekod windsurfeeer 12. 2. 2007 13:00

Díky všem, dělal jsem to na localhostu, takže link nebyl. Nějak jsem to CSS poupravoval (ale nejsem teď schopen vysvětlit jak) a už to splňuje co jsem od toho očekával. Teď to pustím ven, tak pokud by někdo chtěl kouknout, tak na http://www.alkotester.cz je výsledek.

Cílem bylo, aby aktivní odkaz v levém menu vypadal jinak, než neaktivní odkazy.
windsurfeeer
Junior

Odeslat příspěvekod Kyosuke 12. 2. 2007 13:21

To bys ale měl být schopen vysvětlit, jak jsi to upravil, abychom si z toho i my taky něco odnesli. ;-)
Kyosuke
Junior

Odeslat příspěvekod windsurfeeer 12. 2. 2007 14:02

No procházel jsem postupně jednotlivé do sebe vnořené classy a IDčka vyzobával z nich paramtery které jsem pak dával jakoby až do poslední aplikovatelné úrovně. Problém byl, zdá se, v tom, že se některý parametr ve vnořené úrovni mlátil s tím samým parametrem nastaveným výše na jinou hodnotu. Měl jsem za to, že platí ten co ne nejhlouběji, ale nějak to nechtělo fungit.

To bych tu musel dát celou strukturu vygenerované html stránky a kompletní CSS. Jenže se obávám že se v tom už ani já teď nevyznám. :)

Bylo to totiž CSS dělané externí firmou a já jsem si ho teď upravoval pro jiné použití. Asi mi to tenkrát nějak zbytečně zašmodrchali, aby web fungoval a měli ode mě pokoj. Např. se tam objevuje "color: #FFF" což mi připadá že asi není správně, že?

Holt až bude chvíle, tak to projdu a zkusím to css vyrobit od základu znova. Už jsem aspoň pochopil jak css vlastně pracuje.
windsurfeeer
Junior

Odeslat příspěvekod Kyosuke 12. 2. 2007 14:22

Nejsem si jistý, jestli tomu rozumím správně. Co vím ale zcela určitě je to, že ID má před class prostě prioritu. To nikdo neoblbne, leda, že by to byla vadná implementace. ;-)
Kyosuke
Junior

Odeslat příspěvekod windsurfeeer 12. 2. 2007 14:33

Kyosuke: Problém byl nejspíš v tom, že se duplikoval stejný parametr s různými hodnotami v CSSku. To moje CSS mi přijde málo strukturované a dost zašmodrchané.

Anebo má Forpsi někde něco nakopnuto.

Pokud chceš, najdeš obě verze (před a po) CSSka na http://www.alkotester.cz/templates/alkotester2/css/css.zip
windsurfeeer
Junior


Kdo je online

Uživatelé procházející toto fórum: Žádní registrovaní uživatelé a 0 návštevníků