suit: Balken mit Bildern

Beitrag lesen

Ich habe da was in einem meiner Lieblings Büchern gefunden. Vielen dank an Corina Rudel und Ingo Chao. Die Lösung heißt Blocksatz. Eine Menge "div's" und ein "spam" bilden die Wörter in diesem Satz. Das erste und letzte "div" sind nur ein Pixel breit und sollen unsichtbar bleiben. Sie haben nur die Aufgabe für den gleichen Abstand links und rechts, wie zwischen den Bildern zu sorgen. Das "spam" hat eine Breite von 100% und löst den Blocksatz aus. Denn einen Blocksatz mit einer Zeile gibt es nicht. Die anderen "div's" bekommen nun Hintergrundbilder und deren Größe.

padding und margin sind Fremdwörter für dich oder?

Das gemeinsame Elternelement bekommt links und oben einen entsprechenden Abstand, alle Kind-Elemente rechts und unten. Problem gelöst - jedes Bild hat in alle Richtungen exakt denselben Abstand.

Wenn die Elemente gleich groß sind kann man float verwenden, ansonsten ist inline-block geeigneter.