Autor Zpráva
inseminator
Profil *
Asi pořád nerozumům dědičnosti v css. Jak mám docílit toho, aby li v benefits měli vlastní šířku atd. a aby se jich parametry z pricing netýkaly?


http://jsfiddle.net/r1kt1gq8/
Keeehi
Profil
Můžeš určit, že se má jednat pouze o přímé potomky.
.pricing > ul > li
Bubák
Profil
inseminator:
Asi pořád nerozumům dědičnosti v css.
Šířka se nedědí, nedědí se ani pozadí. Zápasíš s tím, že vlastnosti se aplikují na vše, co vyhovuje selektoru a nevíš, co s tím. Nejjednodušší je použít silnější selektor a přebít.
.pricing .benefits li {...}
Pokud potřebuješ přebít i vlastnosti deklarované pro n-té li, což je poměrně silný selektor, tak potom třebas:
.pricing ul .benefits li {...}

Keeehi:
Můžeš určit, že se má jednat pouze o přímé potomky.
Což není úplně triviální, protože v kódu je ještě nadpis, takže
.pricing h3 + ul > li
Což ukazuje, že stačí trochu změnit HTML, CSS selektor "se nechytí" a celé se to rozpadne.
Doporučil bych použít třídu pro nezanořené UL a tu využít k selektoru > (přímého potomka).
Keeehi
Profil
Bubák:
Můj i tvůj zápis je správný. Tvůj je více konkrétní, takže je i více náchylný na změnu html.
Bubák
Profil
Keeehi:
Můj i tvůj zápis je správný. Tvůj je více konkrétní, takže je i více náchylný na změnu html.
Je to tak, omlouvám se za mystifikaci.
inseminator
Profil *
Děkuji oběma za rady. Rozumím tomu správně, že znak > ovlivňuje pouze přímé potomky?
Keeehi
Profil
inseminator:
Ano, A > B říká, že aby byl B vybrán, musí mít rodiče A. I když bude B v A ale někde hlouběji (tedy A nebude rodič ale prarodič) tak vybráno nebude.
A > B
========
A
    B - ano
--------    
A
    C
        B - ne
--------
A
    A
        B - ano
            B - ne
        B - ano
        B - ano
--------
A
    B - ano
        A
            B - ano
inseminator
Profil *
Super, děkuji moc za objasnění!

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: