[sкavєи]

Hi,

ich benötige einen speziellen CSS-Selektor. Und zwar habe ich folgende Code-Struktur:

<ul><li><a><img /></a></li></ul>

Nun habe ich für Listen bereits ein li:before definiert:

ul > li:before {
  bla: bla;
}

Ich möchte aber, dass dies nicht angewendet wird sobald in der Liste die Kindselemente ein Link und ein Bild (also wie oben) sind. Also gewissermaßen ein:

li:before < a < img {
  display: none;
}

So funktioniert das nicht. Aber wie bekomme ich das sauber hin?

Das ganze soll am Ende eine Art Galeriestruktur haben, also so dass ich immer 3 Bilder in einer Reihe habe. Ich mus das mit Listen machen (je eine Liste pro Zeile mit 3 Bildern), da der Code aus Markdown-Syntax erzeugt wird und reines Markdown keine Tabellen kann.

Gruß
skaven

Dieser Beitrag wurde von sкavєи bearbeitet: 14. Dezember 2013 - 15:01

[Holger_N]

Also das ausschließen bestimmter Klassen (in dem Fall class="ohne") funktioniert mit

li:not(.ohne):before {…}

also nur als Beispiel für das grundsätzliche Negieren. Nun weiß ich aber nicht, wie man statt der Klasse das a: als Bedingung einbaut. Ich bin mir auch nicht so sicher, ob das überhaupt geht, dass die Eltern vom Kind abhängig sind.

[sкavєи]

Ich habe nochmal ein wenig weitergesucht. Es scheint wohl im CSS4-Draft drinzustehen. Aber ist leider noch nicht ganz endgültig. Da gibt es dann nämlich sogenannte Subject Selektoren. Aber im aktuell einsatzfähigen CSS scheint das nicht ohne weiteres Möglich zu sein. Schade.

Muss ich mir halt irgendwas anderes überlegen.

[Holger_N]

Was sind denn die Listenelemente, die nicht Links UND Bilder sind? Nur Links oder nur Bilder? Also sind alle Elemente Bilder, die nur teilweise verlinkt sind oder sind es alles Links, die nur teilweise bebildert sind?

Dieser Beitrag wurde von Holger_N bearbeitet: 14. Dezember 2013 - 17:00

[sкavєи]

Na ja, das Problem ist halt, dass ich trotzdem noch Listenelemente als normale Listen nutzen will. Aber ich muss halt irgendwie mit dem beschränkten Satz an Markdown-Kommandos eine Gallerie verwirklichen. Es muss halt nichtmal unbedingt mit Listenelementen gemacht werden. Das war in meinen Augen nur die naheliegendste Lösung, wenn ich keine Tabellen machen kann.

Falls mir nichts sinnvolles anderes einfällt kann ich auch noch versuchen das ganze System umzuschreiben und MultiMarkDown zu verwenden (wo es Tabellen gibt), aber das wollte ich eigentlich verhindern.

[Holger_N]

Na ich dachte wenn zum Beispiel da immer Bilder drin sind aber nicht alle verlinkt sind, dann könnte man die unverlinkten mit # verlinken und dem ersten a im Listenelement dieses :before zuordnen unter der Bedingung, dass der Link auf # zeigt.

Sollte so funktionieren:

li a:first-child[href="#"]:before{…;}


Wenn es aber so ist, dass die Listenelemente alle Links enthalten aber nicht alle bebildert sind, dann funktioniert das natürlich nicht.

Dieser Beitrag wurde von Holger_N bearbeitet: 14. Dezember 2013 - 20:20

[sкavєи]

Das Problem ist ja, dass ich durch das Markdown recht beschränkt bin und keine Klassen oder IDs vergeben kann. Und bisher verlinke ich alle Bilder. Ist wie gesagt für eine Galerieübersicht, also Thumbnails. Und der Link geht dann halt auf das Originalbild.

Aktuell habe ich eine Lösung in der ich einfach die Liste innerhalb eines blockquotes anlege. Dann kann ich den Selektor auf blockquote > ul:before setzen. So geht es.

Und im Markdown lässt sich das mit

> - Bild
>   Bild
>   Bild
> - Bild
>   Bild
>   Bild

umschreiben. Das wird dann entsprechend konvertiert.

[Holger_N]

Achso, ich dachte es gäbe innerhalb einer einzelnen Liste unterschiedliche Listenelemente wo für ein Element das before gelten soll und für das nächste nicht.