|
|||
NTH Selector Problem...
Hallo =)
Ich habe derzeit ein Problem diese nth selectoren richtig zu verstehen... HTML HTML-Code:
<a href="eren-jäger"><div class="charinfo_box"><img src="images/charaktere/protagonisten/erenjaeger.png" border="0" alt="" /><p>Eren Jäger</p></div></a> <a href="eren-jäger"><div class="charinfo_box"><img src="images/charaktere/protagonisten/mikasaackermann.png" border="0" alt="" /><p>Mikasa Ackermann</p></div></a> <a href="eren-jäger"><div class="charinfo_box"><img src="images/charaktere/protagonisten/arminarlert.png" border="0" alt="" /><p>Armin Arlert</p></div></a> <a href="eren-jäger"><div class="charinfo_box"><img src="images/charaktere/protagonisten/erenjaeger.png" border="0" alt="" /><p>Eren Jäger</p></div></a> <div class="clear">*</div> Code:
/* PROTAGONISTEN: ====================================*/ .charinfo_box { padding: 10px; margin-right: 24px; margin-bottom: 24px; float: left; border: 1px solid #404040; } .charinfo_box:hover { background: #000000; cursor: pointer; } .charinfo_box:nth-child(4n) { margin-right: 0; } .charinfo_box p { padding: 0; margin: 10px 0 0 0; text-align: center; } .charinfo_box img { border: 1px solid #000; box-shadow: 0px 0px 1px #FFFFFF; } Gruß Sven |
Sponsored Links |
|
|||
Weil jedes div jetzt das erste Kind in einem Link ist.
Du willst jetzt das div in jedem vierten Link selektieren.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
|
|||
Hab schon so sachen wie:
Code:
.charinfo_box a div:nth-child(4n) { margin-right: 0; } |
|
||||
Wie fricca schon schrieb: a ist das vierte Kind, nicht div (das ist immer erstes, eben von a). Wende den betreffenden Selektor also auf a an, nicht auf div.
Und argh, solche Usernamen machen mir immer Appetit http://autoimg.kochbar.de/kbrezept/3...-bild-nr-5.jpg
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) |
|
|||
wow! vielen dank für diese extrem schnellen Antworten! =)
Und ja, esse sogar zufälligetwas BamiGoreng ähnliches Alle anderen Wunsch namen waren immer vergeben... BamiGorengo ist eben immer frei "So sei es Schicksal, von nun an sei mein Name BamiGorengo" Code:
.charinfo_box a:nth-child(4n) div { margin-right: 0; } Hier mal der Link zur Webseite: Charaktere Protagonisten |
|
|||
Weder die Links noch das div sind Nachfahren eines Elements mit der Klasse .charinfo_box.
Das sind jetzt aber absolute Grundlagen.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
|
|||
Das stimmt... Also müsste ich noch eine Div um jedes einzelne Element drum rum Packen damit ich den Inhalt der div ansprechen kann oder?
Nachtrag.: Sorry ich werde einfach mal versuchen das ganze zu löschen und von neu auf zu bauen. Danke für die Informationen! =) Geändert von BamiGorengo (08.11.2013 um 16:44 Uhr) |
|
||||
Nicht zwangsläufig, denn Klassen von a & div sind ja bereits vorhanden.
__________________
Wer keinen Link auf seine problembehaftete Seite posten kann, weil diese noch nicht online ist: Testcase bauen, online stellen, Link posten. Internet-Grundregel: Unbekannte Begriffe googeln! (Erspart 99% aller Nachfragen.) |
Sponsored Links |
|
|||
Nein.
div.charinfo_box würde ein div mit der Klasse ansprechen. Du brauchst diese Divs auch nicht. Lösch sie raus. Gib die Klasse direkt dem Link. Dann hast du wieder die einfachere Ausgangssituation wie zu Anfang. Wenn du XHTML 1.0 verwendest darfst du innerhalb von Links keine Blockelemente verwenden. Bitte validieren.
__________________
Corina Rudel Online-Einsteigerkurs HTML/CSS | Buch: Fortgeschrittene CSS-Techniken |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
nth Element | Rico | CSS | 4 | 07.08.2013 14:11 |