Pinnwand aus Bildern - Float?

Guten Abend, ich bins nochmal :wink:

Mein Plan: ich möchte eine Art Pinnwand machen, an die mehrere, verschiedene Bilder gepinnt sind. Um sich das mal vorstellen zu können, habe ich hier mal eine Testseite erstellt, die nach dem gleichen Prinzip aufgebaut ist. Innerhalb der Divs sind allerdings sonst nicht nur 1 Bild, sondern entweder 1, 2 oder 3 Tables, die normal untereinander aufgebaut sind und sonst keine weiteren CSS Stile enthalten. Den Sourcecode könnt ihr euch ja direkt im Browser anzeigen lassen.

Edit: Die URL hatte ich doch glatt im Halbschlaf vergessen:
http://ot.lenwo.de/test/

Wenn ihr die seite betrachtet, werden ihr sicher festellen, dass die Anordnung der Bilder nicht ganz richtig ist. Momentan sieht es bei mir so aus:

http://ot.lenwo.de/test/wrong.jpg

Es sollte aber so aussehen:

http://ot.lenwo.de/test/correct.jpg

Die Bilder sollen sich also am Ende der Seite immer in der nächsten Zeile unter dem nächsten Bild in der vorigen Reihe anordnen.

Ist das Möglich? Was für Style-Eigenschaften brauche ich? Muss ich von der Html-technischen Seite noch etwas ändern?

Ich dachte mir, dass ich vllt nur etw. am Float, am Display oder white-space ändern müsste, weiß aber nun auch nicht weiter. Ich bin in CSS noch nicht so weit fortgeschritten und bin immer über jede Hilfe dankbar!

Vielen Dank im Voraus und schönen Abend noch, oder gute Nacht :wink:

Ich glaube nicht, dass das möglich ist, habe aber keine Begründung parat. Wenn die Anzahl der Spalten nicht variabel ist, könntest du eine optimalere Verteilung serverseitig errechnen. Wenn sie variabel ist (durch Veränderung der Viewport-Größe), höchstens über JavaScript.

Okay, erstmal vielen Dank für die Antwort. Das ganze wird mir dann doch ein bisschen zu kompliziert :wink:

Würde es die Möglichkeit geben, dass die einzelnen übrigen Bilder, wenn die Reihe zu lang is, einfach rechts aus dem Bildschirm Rand rausragen, und dann mit Hilfe einer horizontalen Scrollbar einzusehen sind?

Es würde gehen wenn ich die Breite des Body z.B. auf 6000 px setze, aber mir wäre lieber, wenn diese genauso Breit ist, wie auch der Inhalt. Wie wäre das Möglich?

Vielen Dank im Voraus, schönen Abend noch!

Ich möchte ungern pushen, aber ich hab ja nun schon ein paar Tage gewartet …

Ist die einzige Lösung die Breite des Bodys aus der Breite der Divs und Tables zu errechnen und demnach zu skallieren?

Gibt es nicht irgendeine Lösung, wo sich die Breite des Bodys direkt an den Inhalt anpasst, oder der Inhalt aus dem Body herausragt?

Nochmal zur erklärung, ich habe einige Divs nebeneinander (Float), die quasi eine lange Reihe rechts aus dem Bildschirmrand bilden sollen. (Mit Scrollbalken)

Vielen Dank im Voraus,

Unknown

Ich weiß nicht, ob ich dich richtig verstehe (wundert mich nämlich, dass das noch keiner geantwortet hat), aber das sollte mit der overflow-Eigenschaft von CSS funktionieren. Mehr Informationen dazu etwa hier: SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

In diesem Fall kannst du allerdings glaube ich nicht mehr mit Floats arbeiten, sondern musst die Bilder nebeneinander in eine Zeile setzen.