:before und :after verschachteln
toneman
- css
Hallo!
Ich habe meine A Tags mit :before und :after wie folgt bearbeitet:
a:before {content:"[";}
a:after {content:"]";}
Nun habe ich aber auch img Tags zwischen A Tags und da sehen die Klammern recht doof aus.
Also habe ich folgendes versucht:
a img :before { content:"";}
a img :after { content:"";}
brachte nix
a img:before { content:"";}
a img:after { content:"";}
auch nicht.
Wie bringe ich meinem Opera bei, dass er nur Textlinks klammern soll?
mfG
Toni
Hi,
Nun habe ich aber auch img Tags zwischen A Tags und da sehen die Klammern recht doof aus.
Du willst also ein Element abhängig davon formatieren, welchen Inhalt es hat.
Dafür gibt es in CSS 2 keine passenden Selektoren.
Soweit ich weiß, auch nicht im Selektor-Modul von CSS 3 - ich finde zumindest nichts in http://www.w3.org/TR/css3-selectors/#selectors
Es bleibt also nichts anderes übrig, als die Bild-Links mit ner Klasse zu versehen und dann per
a.bild:before zu selektieren.
Also habe ich folgendes versucht:
a img :before { content:"";}
Damit selektierst Du nichts.
Denn das würde vor dem Inhalt von Elementen innerhalb von img-Elementen innerhalb von a-Elementen selektieren.
Da img-Elemente aber keinen Inhalt haben (content-model ist EMPTY), kann es keine Elemente innerhalb geben...
a img:before { content:"";}
Damit wird der content vor dem img ausgegeben - aber das beeinflußt natürlich nicht, was vor dem a ausgegeben wird.
cu,
Andreas
Hallo Andreas
Dafür gibt es in CSS 2 keine passenden Selektoren.
argh
Da img-Elemente aber keinen Inhalt haben (content-model ist EMPTY), kann es keine Elemente innerhalb geben...
argh 2
Es bleibt also nichts anderes übrig, als die Bild-Links mit ner Klasse zu versehen und dann per
a.bild:before zu selektieren.
Ok, das werd ich versuchen.
Vielen Dank für die prompte Antwort.
Toni
Hallo Andreas
Es bleibt also nichts anderes übrig, als die Bild-Links mit ner Klasse zu versehen und dann per
a.bild:before zu selektieren.
Also das hab ich nun versucht.
<a href="http://irgendwas"><img class="bild src="blabla"></a>
und via CSS
a.bild:before { content:"";}
a.bild:after { content:"";}
Es hat sich gar nichts getan. Die Klammern sind immernoch da.
Ausserdem hab ich festgestellt, dass der IE 6.0.2800.1106 das before und after komplett ignoriert (Opera und Firefox sind brav)
Was hab ich bei dem img Tag falsch gemacht?
Toni
Hi,
Es bleibt also nichts anderes übrig, als die Bild-Links mit ner Klasse zu versehen und dann per
a.bild:before zu selektieren.Also das hab ich nun versucht.
<a href="http://irgendwas"><img class="bild src="blabla"></a>
Sagte ich was davon, die Bilder mit Klasse zu versehen?
Nein, ich sprach davon, die Bild-LINKS mit ner Klasse zu versehen. Die Klasse muß in den Link!
Ausserdem hab ich festgestellt, dass der IE 6.0.2800.1106 das before und after komplett ignoriert
Naja, CSS 2 ist erst knapp 5 Jahre alt, da kann man doch vom Marktführer nicht erwarten, daß er das schon umgesetzt hat...
cu,
Andreas
Hallo Andreas
Sagte ich was davon, die Bilder mit Klasse zu versehen?
Nein, ich sprach davon, die Bild-LINKS mit ner Klasse zu versehen. Die Klasse muß in den Link!
Asche auf mein Haupt
Naja, CSS 2 ist erst knapp 5 Jahre alt, da kann man doch vom Marktführer nicht erwarten, daß er das schon umgesetzt hat...
Da freu ich mich doch, dass ich den Opera so mag
Danke vielmals
Toni
Hallo Andreas,
Soweit ich weiß, auch nicht im Selektor-Modul von CSS 3
Ich habe mal vor einiger Zeit in den Archiven von www-style rumgeforscht
und mußte leider entdecken, daß jeder Vorschlag, der in diese Richtung
ging, abgeblockt wurde. Aus Performancegründen, hieß es.
Tim