Julia: Float: left, aber trotzdem zentriert?

Hallo, ich habe für meine Galerie einen CSS Code geschrieben:

.wallgallery {
float: left;
width: 230px;
height: auto;
background: #FAEBE7;
padding: 5px;
margin: 20px 15px 15px 20px;
}

#wallcontainer {
text-align: center;
margin: auto;
}

Ich möchte, dass die Thumbnails nebeneinander stehen, so wie in wallgallery beschrieben. (float: left;) Trotzdem sollen sie innerhalb der Seite zentriert sein. Ich habs mit "center" probiert, aber irgendwie funktioniert "center" nicht mit "float: left" zusammen. Habt ihr ne Idee?

  1. .wallgallery {
    float: left;

    Hast Du an dieser Stelle schonmal "text-align: left;" probiert? Vielleicht funktioniert das besser...

    Hab keine wirkliche Ahnung, ist nur ein Versuch...

    Grüße,
    elvirus

    1. "text-align" bezieht sich leider nur auf den Text innerhalb der divs, jedoch nicht auf die Position der divs nebeneinander. :\ Der Text in "wallgallery" soll zentriert sein, funktioniert leider nicht.

      1. hast Du mal margin:auto probiert statt float? Das kommt in dem Zusammenhang oft vor.

        Grüße,
        elvirus

      2. Yerf!

        "text-align" bezieht sich leider nur auf den Text innerhalb der divs, jedoch nicht auf die Position der divs nebeneinander. :\ Der Text in "wallgallery" soll zentriert sein, funktioniert leider nicht.

        Der Text wäre schon zentriert, wenn einer da wäre... Aber die Divs werden mit flaot:left eben an den linken Rand neben den Text gestellt, deswegen kann keine Zentrierung wirken.

        Eine Möglichkeit wäre, dem umgebenden Container eine feste Breite zu geben, damit das margin:auto dafür wirken kann. Möglicherweise aber eine schlechte Idee, wenn sich die Breite der anzahl der Bilder automatisch anpassen soll.

        Eine 2. Variante wäre evtl. statt float mit display:inline-block zu arbeiten, aber das kann der Firefox noch nicht (und -moz-inline-block hatte zuletzt noch Bugs).

        Gruß,

        Harlequin

  2. Hi!

    Der Container ist ja zentriert. (horizontal, vertikal geht nicht)

    Da dein container aber immer die Breite des Viewports hat, merkt man natuerlich von einer Zentrierung reichlich wenig. Du musst ihm also schon eine Breite verpassen. Wenn Du weisst, dass deine Elemente allesamt eine Breite von x haben sollte der Container eine Breite von mindestens Anzahl Elemente * x haben.

    Die Frage die sich mir stellt: warum floates Du? Mir scheint es um Bilder, also Grafiken (<img>) zu gehen. Die erzeugen fuer gewoehnlich keinen Umbruch und muessen nicht (left) gefloatet werden. Jedenfalls nicht wenn Du nur eine gewoehnliche Matrix aus Grafiken erstellen moechtest.

    Kann ja aber auch sein, dass Du divs benutzt um z.b. noch Text unter/ueber/neben den Bildern darzustellen. Dann ist das schon richtig so.