CSS: A co takle selektor opačného potomstva?

Je s podivem, že naprosto stejnému problému jsem čelil ve svých kodérských začátcích, a dnes, ostřílený a postřelený matador, stejně jako tehdy nedovedu nalézt jeho řešení. Respektive řešení neexistuje, alespoň ne takové, jaké by mělo. Procházel jsem specifikace CSS3 a nenašel jsem tam ani náznak toho, že by snad řešení mého problému s potomky bylo na cestě. A přitom… tento kodérský oříšek považuji za docela závažný. Tak moc závažný, že nechápu, proč jsem o tom dosud nic nečetl.

Dnes a denně při výběru prvku, na který bude aplikován styl, vždy onen prvek určujeme tak, že kaskádu sjíždíme od rodičů k potomkům, tedy sestupně. Ale co když chci proces výběru obrátit? Co když chci vybrat element na základě jeho potomků?

Pro lepší pochopení je tu příklad: Chci nastavit styl všem takovým elementům a, které mají mezi potomky element img. Jak na to? A teď doufám, že jsem specifikaci prohledával maximálně pečlivě.

Jak by to mohlo vypadat?

A teď trošku fantazírování. Představoval bych si to například takto:

.article a:contains(img) {...}

Trochu jsem nad tím přemýšlel, a došel jsem právě k tomu, že bez závorky to nepůjde. Může se teoreticky zdát intuitivnější použití symbolu <, obrácená varianta selektoru pro přímé potomstvo, ale i pak by přišla závorka vhod, pokud bych chtěl…

Věru, takovýmto hloupostem se věnuji v dnešních letních nocích. Prozatím to teda vezmu nějak oklikou, ale… neznáte někoho ve W3C, že bychom to ještě narychlo strčili do trojky? :-)

Případné řešení přes JS

Jelikož jsem dobrák, ještě se podělím o své dočasné řešení. Možná poznáte, že to není čistý java-script, ale jQuery, ale jinak to neumím a taky nechci umět.

$('.article a img').parent('a').addClass('contains-img');

O článku CSS: A co takle selektor opačného potomstva?

Komentáře (5)

k formuláři

RSS kanál komentářů

    • Komentář číslo: 1
    • *
    • Jméno: endlife
    • Odesláno:
      25.8. 2007 — 11:38

    Trojkaři jsou konzervy, ale třeba by ti to vzali do pětky :)

    // http://ln.hixi­e.ch/?start=1181118077­&count=1

    • Komentář číslo: 2
    • *
    • Jméno: Kahi
    • Odesláno:
      25.8. 2007 — 15:25

    [1] endlife: → dík za odkaz, zajímavé čtení

    • Komentář číslo: 3
    • *
    • Jméno: Jan Brašna
    • Odesláno:
      7.9. 2007 — 2:48

    Je to hlava XXII, vykreslování CSS spoléhá na jakousi iterativní konzistenci, tzn. by překreslování rodiče dle potomka mohlo skončit nedefinovaným stavem při „zacyklení“ vazby vlastností navzájem. Dá se o tom hodně najít v archivu www-style na W3.

    • Komentář číslo: 4
    • *
    • Jméno: Kahi
    • Odesláno:
      7.9. 2007 — 15:18

    Jan Brašna → Díky, našel jsem zatím jeden href=„http://­lists.w3.org/Ar­chives/Public/www-style/2007Apr/thre­ad.html#msg105“ rel=„nofollow“>http:/­/lists.w3.org/Ar­chives/Public/www-style/2007Apr/thre­ad.html#msg105 thread a myslím že nemá význam hledat ty dřívější… Jak zní jedna odpověď,

    It is not as simple as it looks when you consider…

    Takže… :-)

    • Komentář číslo: 5
    • *
    • Jméno: byF
    • Odesláno:
      21.2. 2008 — 12:33

    Je to hlava XXII, vykreslování CSS spoléhá na jakousi iterativní konzistenci, tzn. by překreslování rodiče dle potomka mohlo končit nedefinovaným stavem při „zacyklení“ vazby vlastností navzájem.

    Nešlo by to řešit prioritou operátorů?

    Právě dělám jednu věc v práci se zbytečně komplikovanými styly a přesně tenhle operátor bych teď náramně potřeboval.

Přidat komentář

Nápověda ke psaní komentářů

Zde formátuje Texy!

  • *zvýraznění*
  • **silné zvýraznění**
  • > citace
  • "odkaz":http://kam
  • [4] reakce na komentář
  • zdrojové kódy a více

komentáře

úplně nahoru