Jochen: "Innere Divs" spannen das "äußere Div" nicht auf

Hi,

ich habe ein Problem mit meinen Fotoalben: Die Thumbnails will ich in "kleine" Divs einbinden, damit sie einen Rahmen bekommen:

<div id="rahmen">
<img src="fotoalben/2007_06_20/kl/2007_06_20_0003.JPG" border=0 alt="">
</div>

Die Thumbnails selber sind von einem Div umrahmt:

<div id="inhalt1">
            <p class="p1"><span>

alle Bildereinträge

</span></p>
        </div>

Jetzt dachte ich, daß durch die vielen Bildeinträge, das <div id="inhalt1"> aufgespannt wird, die Bilder also innerhalb dieses Divs erscheinen.

Allerdings kann man, wenn man die angebene URL folgt, sehen, daß das nicht der Fall ist. Das <div id="inhalt1"> erscheint, als ob kein Inhalt erkennt wird und die Bilder liegen außerhalb.

http://www.jochen-lipps.de/test/test.html

Das Div für ein Bildeintrag ist so definiert:

#rahmen {
position: relative;
background: #ffffff;
margin: 2px;
padding: 5px;
border: 4px double Silver;
float: left;
}

Das ist sicher ein Anfängerfehler (und ein Anfänger in CSS bin ich auch), aber ich komme einfach nicht drauf.

Wenn ich "float: left;" entferne, sind die Bilder zwar innerhalb des Divs, die Seite wird angezeigt wie sie soll, aber es ist dann jeweils nur ein Bild in einer Zeile.

http://www.jochen-lipps.de/test/test2.html

Die Float-Anweisung ist mir dahingehend wichtig, daß ich mir mit ihr keine Gedanken um die Formatierung der Seite machen müsste, da einfach die zur Verfügung stehende Breite von den Bildern ausgefüllt wird, auch wenn ich es sie breiter mache oder schmäler.

Kann mir da jemand weiterhelfen?
Danke!
:-)

LG
Jochen

  1. Hallo Jochen,

    Jetzt dachte ich, daß durch die vielen Bildeinträge, das <div id="inhalt1"> aufgespannt wird, die Bilder also innerhalb dieses Divs erscheinen.

    Allerdings kann man, wenn man die angebene URL folgt, sehen, daß das nicht der Fall ist. Das <div id="inhalt1"> erscheint, als ob kein Inhalt erkennt wird und die Bilder liegen außerhalb.

    Doch, im IE spannen die Thumbnails ja den umgebenden Container auch auf, was sie aber eigentlich auch dort gar nicht dürften, es sei denn du setztest ein Element dahinter z.B. ein BR das das float der vorausgehenden Elemente mit einem entsprechendem clear wieder aufhebt (mit Rücksicht z.B. auf Netscape 7) und du gäbest dem umschließenden Element auch noch eine bestimmte Weite und/oder Höhe in Verbindung mit etwas anderem als overflow:visible.

    Den "block-formatting context" hat Molily in seinem Artikel unter dem Stichwort "Wunderwaffe overflow" schön beschrieben. Darüber habe ich ihn  auch verstehen gelernt.

    http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#wunderwaffe-overflow

    Gruß Gernot

  2. Hallo

    Kann mir da jemand weiterhelfen?

    Vielleicht. Der Internet-Explorer stellt das ganze richtig da, nur Firefox braucht etwas Nachhilfe (nun ja, eigentlich stellt Firefox es korrekt da und IE...aber lassen wir das).

    Vermutlich musst Du unter die floatenden Div's (also unmittelbar, bevor Du das umgebende DIv welches sich mitdehnen soll, wieder schliesst) ein

    <div style="clear: both"></div>
    einfügen (natürlich steht es Dir frei, die unschöne inline-Style-Angabe durch eine CSS-Klasse Deiner Wahl zu ersetzen).

    Frag mich aber nicht warum das so ist, ich versteh's bis heute nicht.
    (Jemand anderes im Forum vielleicht?)
    Ich weiß nur, dass es Firefox offenbar wünscht, dass "floatende" Bereiche auf diese weise wieder beendet werden, damit er divs, die aussen herum liegen, korrekt mit-vergrößern kann.

    Hope that helps.

    Viele Grüße,

    Jörg

  3. Hi Jochen,

    ergänzend zu den anderen noch ein Tipp von mir.

    Grüße,
    Engin
     GYRO

    --
    "I would like to buy a hamburger"
    Der Valligator
    sh:( fo:| ch:? rl:( br:> n4:? ie:{ mo:} va:? js:| de:µ zu:] fl:| ss:{ ls:?
    1. Hallo Engin,

      ergänzend zu den anderen noch ein Tipp von mir.

      Was können wir nur machen, dass Wahsaga endlich wiederkommt, der hat immer alles, aber auch wirklich alles zu Sagende allumfassend auf den Punkt gebracht, in nullkommanichts Sekunden. Ich glaube ich werde ihm demnächat noch mal mailen (das erste Mal hat er ja nicht reagiert), oder willst du ihm mal gut zureden, Engin?

      Gruß Gernot

      1. Hallo Gernot!

        Ich vermisse Christoph auch. Aber... vielleicht ist die Hoffnung, dass er mal wiederkommt, nicht ganz verloren, solange er Vorschläge wie auch dieser hat...

        Viele Grüße aus Frankfurt/Main,
        Patrick

        --

        _ - jenseits vom delirium - _
        [link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash]
        Nichts ist unmöglich? Doch!
        Heute schon gegökt?
      2. Hi Gernot,

        Was können wir nur machen, dass Wahsaga endlich wiederkommt,

        Ein Aufruf aus dem Self Raum, alle die gerne wahsagas Beiträge gelesen haben sollen ihm eine Mail schreiben.
        Ich würd gleich 2 schreiben.

        Ich glaube ich werde ihm demnächat noch mal mailen (das erste Mal hat er ja nicht reagiert), oder willst du ihm mal gut zureden, Engin?

        Ich hab ihn auch schon mal angemailt, kam auch keine Reaktion. Ist aber schon etwas länger her.

        Aber... vielleicht ist die Hoffnung, dass er mal wiederkommt, nicht ganz verloren, solange er Vorschläge wie auch dieser hat...

        Als ich diese vor ein Paar Tagen gesehen hab, dachte ich die Forums-Software spinnt. *g
        Scheint aber nicht der Fall zu sein.

        Grüße,
        Engin
         GYRO

        --
        "I would like to buy a hamburger"
        Der Valligator
        sh:( fo:| ch:? rl:( br:> n4:? ie:{ mo:} va:? js:| de:µ zu:] fl:| ss:{ ls:?
  4. Danke für die Tips und die Links!
    Jetzt gehts... jetzt muß ich nur noch überlegen, welche der vorgeschlagenen Methoden ich nehmen soll, denn auf den ersten Blick gehen alle.
    :-)