Bild in Div zentrieren

[Sam]

Moin,

ich habe ein fieldset in einem div. Im Fieldset befinden sich noch ein paar Bilder untereinander. Die Bilder wollte ich per margin:auto zentrieren, das klappt aber irgendwie nicht. Warum?

PS: ich benutze nicht den IE sondern Opera, dass man es im IE mit text-align machen muss weiß ich.

Gruß, Sam

[schwarze Piste]

Tachchen!

Schön, dass du immer aufgepasst hast, als hier erklärt wurde, dass Blocklevelelemente nicht per text-align:center ausgerichtet werden. Aber ist IMG ein Blocklevelelement? ;-)

Gruß

Die schwarze Piste

[Peetah]

Hallo Sam,

warum solltest du text-align nur beim IE verwenden?

Vielleicht klappts so:

Gib dem Fieldset die Eigenschaften:
display:block;
text-align:center;

Dann brauchst du auch das div nicht mehr, wenn außer dem Fieldset mit den Bildern sonst nichts drin ist.

Gruß,
Peetah

[Sam]

Ok, danke, schon kapiert, es geht mit text-align. :)

Das div brauche ich aber, weil ich neben dem Fieldset noch andere floaten will.

[Marc]

Moin moin

ich habe ein fieldset in einem div. Im Fieldset befinden sich noch ein paar Bilder untereinander. Die Bilder wollte ich per margin:auto zentrieren, das klappt aber irgendwie nicht. Warum?

PS: ich benutze nicht den IE sondern Opera, dass man es im IE mit text-align machen muss weiß ich.

Wenn Du die Größe der Bilder und des umgebenden divs kennst, kannst Du mit margin-Angaben arbeiten.

Beispiel:

<div id="bilder" style="width:500px;">
  <img src="#" style="width:250px;margin-left:125px;margin-right:125px;" alt="">
</div>

Also umgebendes div (500px) minus Bildgröße (250px) durch 2 (125px) je Seite.

Das klappt immer und ist bombensicher - wenn alle Bilder gleich breit sind (anders sieht es eh scheiße aus), kannst Du diese Angaben einmalig in die CSS-Datei schreiben, anstatt sie bei jedem img anzugeben (ist eh kein guter Stil).

Also so etwas wie

div#bilder {
  width:500px;
}

div#bilder img {
  width:250px;
  margin:0 125px 0 125px;
}

Gruß,
Marc.

[nag]

Hallo,

Grafiken sind aus HTML-Sicht Inline-Elemente.
Die horizontale Zentrierung von InlineElementen erreichst du mit text-align:center

Für Block-Level-Elementen hingegen muß margin-left und -right auf auto gesetzt werden.

sollte keine der beiden Ansätze zu einer Lösung führen, dann poste den relevanten Quelltext (incl. CSS)

mfg NAG