CZ doména zdarma ke každému ONEbit hostingu
Zobrazují se odpovědi 1 až 16 z 16

Problém s :nth-child(3n)

  1. Dobrý den,

    řeším momentálně jednu úpravu na webu gtstore.cz a to takovou, že přiřadím .imgSmall:nth-child(3n), ale nikdy se to neaplikuje na každý třetí selector s třídou .imgSmall, ale třeba někdy na druhý, někdy na první...

    viz. zde: http://www.gtstore.cz/mx-komplet-fac...t-orange-blue/ (vpravo miniatury pod hlavním obrázkem)

    nevíte, kde dělám chybu? Toto řeším na více webech.

    děkuji za odpovědi
    s pozdravem
    Roman

  2. Co se právě děje na Webtrhu?
  3. Tak, jak to máš, ten selektor vybere prvky, které jsem třetím potomkem svého rodiče (bez ohledu na třídu!!!) a zároveň mají třídu imgSmall. Což splňuje jenom ten první malý obrázek, protože šestý a deváty potomek jsou divy, ale ty zase nemají třídu imgSmall. Pokud chceš pracovat se selektorem nth-child, dej si všechny obrázky pod jednoho rodiče jak máš, ale nemíchej už je s jinýma prvkama na stejné úrovni.

  4. To co říkáš není pravda, jelikož mám strukturu

    1.<obrazky>
    2.<imgSmall />
    3.<imgSmall />
    4.<imgSmall />
    5.<clr />
    6.<imgSmall />
    7.<imgSmall />
    8.<imgSmall />
    9.<clr />
    10.</obrazky

    A já to chci aplikovat na co třeti prvek, a je mi jedno co budu dělat potom s potomkem. Chci proste obrazky imgSmall:nth-child(3), tak by to snad mělo vybrat řádek 4 a 8, ne?

  5. :nth-child chápeš špatně. :nth-child(3n) znamená jakýkoli každý třetí potomek rodiče. A jelikož ty máš v rodiči .obrazky nejprve .imgMain, dále .clr a poté .imgSmall, aplikuje se to na něj jakožto na třetího potomka (i když je to první .imgMain). Další třetí potomek vychází div .clr, jenže ty míříš na potomky s třídou .imgSmall, takže na něj se pravidlo neaplikuje.

    Musíš použít :nth-of-type nebo upravit strukturu html.

  6. Citace Původně odeslal Ondřej Veřtát Zobrazit příspěvek
    :nth-child chápeš špatně. :nth-child(3n) znamená každý třetí potomek rodiče. A jelikož ty máš v rodiči .obrazky nejprve .imgMain, dále .clr a až poté imgSmall, aplikuje se to na něj.
    Děkuji za odpověď a šlo by to nějak udělat myšlenkou, kterou mám?

  7. Místo "nth-child" použij "nth-of-type", tzn. "obrazky a:nth-of-type(3)".

  8. Já bych upravil html, ale jestli ti nevadí, že to bude takové „zfušované“, tak můžeš použít selektor
    Kód:
    a:nth-of-type(3n+4)
    Ten vybere co třetí element „a“ počínaje čtvrtým (4,7,10,13,...).

  9. Citace Původně odeslal Fido123 Zobrazit příspěvek
    Já bych upravil html, ale jestli ti nevadí, že to bude takové „zfušované“, tak můžeš použít selektor
    Kód:
    a:nth-of-type(3n+4)
    Ten vybere co třetí element a počínaje čtvrtým (4,7,10,13,...).
    Upravit HTML nemůžu, nedělal jsem to já.

  10. Citace Původně odeslal Kolonicny Zobrazit příspěvek
    Upravit HTML nemůžu, nedělal jsem to já.
    No, tak to pak nemáš moc na výběr.

  11. Co se tam vlastně snažíš vymyslet? Třeba to ani nepotřebuješ.

  12. Děkuji všem za odpovědi.

    Zeptám se, dá se nějak aplikovat :nth na určitý class?

    1.<obrazky>
    2.<imgSmall />
    3.<imgSmall />
    4.<imgSmall />
    5.<clr />
    6.<imgSmall />
    7.<imgSmall />
    8.<imgSmall />
    9.<clr />
    10.</obrazky

    A já to chci aplikovat na co třetí prvek imgSmall. Chci prostě co třetí imgSmall, řádek 4 a 8, a chci aby to fungovalo případně i kdybych změnil strukturu, prostě vždy co třetí imgSmall...

  13. Podle me mu jde o ten pravy okraj (border) kazdeho tretiho obrazku, ktery splyva s vedlejsim rameckem...

  14. Citace Původně odeslal Ondřej Veřtát Zobrazit příspěvek
    Co se tam vlastně snažíš vymyslet? Třeba to ani nepotřebuješ.
    Potřebuji co třetímu imgSmall dát jiné parametry (např. odstranit pravý border)

    ---------- Příspěvek doplněn 09.10.2015 v 10:03 ----------

    Citace Původně odeslal musil.david Zobrazit příspěvek
    Podle me mu jde o ten pravy okraj (border) kazdeho tretiho obrazku, ktery splyva s vedlejsim rameckem...
    Ano, a chci najít OBECNÝ způsob, takže když tam přibude např. další clear, nebo se tam něco přidá tak aby TO VŽDY vyhledalo co třetí imgSmall

  15. Citace Původně odeslal Kolonicny Zobrazit příspěvek
    Zeptám se, dá se nějak aplikovat :nth na určitý class?
    Ne.

  16. Tak to je docela špatné... :(

  17. Citace Původně odeslal Kolonicny Zobrazit příspěvek
    Tak to je docela špatné... :(
    A proč nepoužiješ to, co jsem ti psal
    Kód:
    a:nth-of-type(3n+4)
    Pokud se nějak dramaticky nezmění html, tak to normálně bude fungovat tak, jak chceš.

Hostujeme u Server powered by TELE3