Marc: Problem bei Verschachtelung von Divs

Beitrag lesen

Hallo zusammen,

Ich habe ein Problem mit der Verschachtelung von Divs! Ich arbeite an einer Fotogallerie mit mehreren Alben, die je nach Album die nötigen Bilder ausgibt - was auch bestens funktioniert.
Allerdings will ich das Ganze auch noch in einem "großen" Div-Container und die Gallerie auf der Seite zentrieren zu können!

der Quell-Code im Browser sieht dann wie folgt aus:

<div class="gallery">
  <div class="thumb"><img src="..."></div>
    <div class="thumb"><img src="..."></div>
    <div class="thumb"><img
    <div class="thumb"><img src="..."></div>
    <div class="thumb"><img src="..."></div>
  </div>
       </div>

Wozu die vielen Divs um jedes Bild?

insofern also noch alles eigentlich so, wie ich es mir vorgestellt habe.
Hier noch die entsprechenden Style Sheets:

DIV.thumb{
  float:left;
  margin: 10px;
  }

DIV.gallery{
  border:4px solid black;
  width: 410px;
  height: auto;
  margin: 0px 10px 0px 10px;
  text-align:center;
    }

Das Ergebnis ist aber nicht unbedingt das, was ich erwartet habe:
http://www.oxp.de/view/pic/39798/med_713186.jpg

Eine echte Seite mit Quelltext wäre besser...

Der "Hauptcontainer" wird also auf einen Bereich mit 0px Höhe reduziert -

Das stimmt nicht.

und die eigentlich enthaltenen Elemente werden außerhalb angezeigt.

Du solltest Dich mal mit der grauen Theorie von floats auseinandersetzen - wieso floatest Du div.thumb überhaupt?

Das Ganze treibt mich echt schon in den Wahnsinn! Ich habe schon alles versucht, was mir eingefallen ist - aber ich verstehe nicht, wo der Fehler liegt!

RTFM! - Zum Beispiel das hier: < http://css-technik.de/css-examples/219_9/>

Ich bin noch ziemlich frisch, was CSS und HTML angeht und wäre wirklich dankbar, wenn mir jemand helfen könnte!

Ich denke, wenn Du die floats verstanden hast, wirst Du sehen, dass sie dir in diesem Fall nicht weiterhelfen (jedenfalls nicht auf den Contanier mit der Klasse thumbs bezogen)

Viele Grüße,
Marc.

--
Und immer schön
validieren (http://validator.w3.org/)