[GastForen Web allgemein HTML und CSS / Stylesheets div-Elemente mit einer bestimmten Klasse ansprechen

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

div-Elemente mit einer bestimmten Klasse ansprechen

Graciosa
Beiträge gesamt: 156

21. Aug 2015, 17:04
Beitrag # 1 von 4
Bewertung:
(5419 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
In einem div mit der Klasse inside
Code
div class="inside" 

stecken viele weitere div-Elemente.

Ich möchte jetzt jedes 2. und 3. vorkommende div-Element mit der Klasse schmal
Code
div class="schmal" 

ansprechen. Das gelingt mir aber nicht.


Wenn ich z.B. als Selektor folgendes wähle:
Code
div.inside div[class*="schmal"]:nth-of-type(2) {} 

spricht er keinen dieser div-Elemente an.

Wenn in Klammern 1 steht oder first-of-type, spricht er alle ersten div-Elemente innerhalb des div.schmal an.

Gibt es irgendeine Möglichkeit, wie ich das lösen kann? Sind div-Elemente keine Kinder? Mit nth-child geht gar nichts.
X

div-Elemente mit einer bestimmten Klasse ansprechen

swisscheese
Beiträge gesamt: 387

21. Aug 2015, 21:03
Beitrag # 2 von 4
Beitrag ID: #542240
Bewertung:
(5386 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Bettina

Das wird mit CSS alleine nicht gehen. Es bräuchte einen "nth-of-class(n)"-Selector, den gibt's aber nicht.
Ein Ansatz wäre mit javascript (z.B. jquery-Library, ist ja heutzutage sowieso überall an Bord) ein kleines Funktiönchen zu schreiben.

Gruss, Gerd


als Antwort auf: [#542235]

div-Elemente mit einer bestimmten Klasse ansprechen

Graciosa
Beiträge gesamt: 156

22. Aug 2015, 11:13
Beitrag # 3 von 4
Beitrag ID: #542243
Bewertung:
(5290 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
... und da hört es leider auf bei mir. Funktiönchen kann ich nicht.

Ich stoße immer wieder auf Situationen, bei denen ich Java Script brauche - irgendwann muss ich das halt lernen - die Zeit reicht leider nicht dazu.

nth-of-class gibt es dann hoffentlich bei CSS4

Für mein Problem habe ich jetzt eine andere Lösung gefunden - das geht jetzt erst mal so.

Danke trotzdem! Es hilft ja auch, wenn ich weiß, dass ich da mit CSS nicht weiterkomme und nicht weiter experimentieren brauche.


als Antwort auf: [#542240]

div-Elemente mit einer bestimmten Klasse ansprechen

MurphysLaw
Beiträge gesamt: 588

24. Aug 2015, 14:48
Beitrag # 4 von 4
Beitrag ID: #542274
Bewertung:
(5157 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Bettina,

ich glaube, es geht doch. Habe da mal ein bisschen gegoogelt:
http://stackoverflow.com/questions/3462298/select-every-nth-element-in-css

Schätze, Du musst nur ein n hinter deine Zahl setzen:
Code
div.inside div[class*="schmal"]:nth-child(2n) 


Probiers doch mal.

Viele Grüße,
Murphy


als Antwort auf: [#542243]
X

Aktuell

InDesign / Illustrator

| 23.05.2022

IDUG_300

Veranstaltungskalender

Hier können Sie Ihre Anlässe eintragen, welche einen Zusammenhang mit den Angeboten von HilfDirSelbst.ch wie z.B. Adobe InDesign, Photoshop, Illustrator, PDF, Pitstop, Affinity, Marketing, SEO, Büro- und Rechtsthemen etc. haben. Die Einträge werden moderiert freigeschaltet. Dies wird werktags üblicherweise innert 24 Stunden erfolgen.

pdf-icon Hier eine kleine Anleitung hinsichtlich Bedeutung der auszufüllenden Formularfelder.

Veranstaltungen
01.03.2023 - 09.03.2023

Online
Mittwoch, 01. März 2023, 00.00 Uhr - Donnerstag, 09. März 2023, 00.00 Uhr

Online Webinar

Wie gehen wir mit diesen Veränderungen um? Was ist notwendig, damit wir die Digitalisierung im Unternehmen klappt? Veränderungsprozesse verstehen und entsprechend handeln Mitarbeiter als Botschafter Webseite mit WordPress erstellen SEA /SEO (Ads aufschalten)

Ja

Organisator: B. Isik - SNF Academy

Kontaktinformation: B. Isik, E-Mailinfo AT snfa DOT ch

https://www.fernstudiumfitness.ch/digitalisierung-schweiz/