Class Thumbnail Bootstrap Z-Index ändern und justify-content-around

[Tabula_Rasa]

Hallo,

ich bin erneut auf Probleme gestoßen.

1. Bei der Verwendung der Klasse thumbnail ist das Bild, wenn man runterscrollt, vor der Navigationsleiste. Ich habe versucht den Z-Index zu ändern aber ging nicht. Ich könnte zwar ganz leicht eine neue Klasse erstellen, aber würde gerne wissen, warum das so ist, falls ich mal was Ähnliches machen möchte. Ich habe ein Bild ohne Thumbnail getestet und da bleibt das Bild hinter der Leiste (Link siehe unten)

2. Von der Seite https://v4-alpha.getbootstrap.com/layout/grid/ habe ich justify-content-around gefunden. Es sieht so aus, als würde bisschen Platz um den Content und dazwischen geschaffen werden. Anstatt des Offsets würde ich lieber justify-content-around verwenden, aber es scheint irgendwie nicht zu klappen.

Da man den Quelltext anzeigen lassen kann, packe ich den Code nicht nochmal hier rein.
Link: http://zerobrothers.bplaced.net/Manga_Home.html

Edit: Eine Frage hätte ich da noch: Warum wird padding-right im body komplett von der Navigationsleiste ignoriert aber padding-left nicht?

 

[threadi]

Die Seite ist nicht aufrufbar.

 

[Tabula_Rasa]

Die Seite ist nicht aufrufbar.

Oh, hab da etwas geändert. Hier der aktuelle Link: http://zerobrothers.bplaced.net/Manga_Home.html

Edit: Dass die Bilder über der Nav-Leiste sind passiert auch bei einer selbsterstellten Klasse.

.rahmen {
background-color:white;
padding:5px 5px 5px 5px;
border-radius:5px;
}

Diese Klasse tut 1 zu 1 was die Klasse thumbnail tut. Auch hier ist das Bild nicht hinter sondern vor der Leiste beim Scrollen.

Edit: Scheint doch auch beim Bild ohne die beiden Klassen aufzutreten

 

[threadi]

Ergänze:

.navigation { z-index: 100; }

 

[Tabula_Rasa]

Ergänze:

.navigation { z-index: 100; }

Warum funktioniert das nicht, wenn ich dem Div einen Index von -100 gebe?
Und hast du eine Idee, wie man das 2. Problem lösen könnte?

 

[threadi]

Weil Elemente mit negativem zindex hinter Elementen ohne zindex liegen - ändert also an deiner Ansicht rein gar nichts.

Beim 2. versteh ich dein Ansinnen nicht wirklich.

 

[Tabula_Rasa]

In der ersten Reihe des Screenshots sieht man das Raum geschaffen wird um und zwischen den einzelnen Columns. Der Code dafür ist der unterste im Screenshots. Das soll durch justify-content-around erreicht wurden sein aber wenn ich das anwende passiert nichts. Möglicherweise habe ich es falsch verstanden.

http://www.bilder-upload.eu/show.php?file=72cace-1501270217.png

 

[Tronjer]

Möglicherweise habe ich es falsch verstanden.

Zumindest das Bootstrap-Grid.

Sofern nicht anders deklariert, hat das Grid immer 12 columns. Dort zwei col-4 ohne offset zu platzieren, ist schlichtweg falsch. Wenn du mit space-around oder between spielen willst, wende das auf Elemente innerhalb der Grid-Container, aber niemals auf die Container mit den Grid-Klassen an.

 

[Tabula_Rasa]

Ich bleibe einfach bei den Offsets :). Eine Fragge hätte ich noch: warum funktioniert padding-left im body aber padding-right nicht bezüglich der Nav-Leiste.