Bildunterschrift ist mit Bildrand nicht bündig (zentriert)

[Maxel]

Hallo liebes Forum,

Seit einem Update auf 2.11.2 tritt bei mit ein Fehler mit der Zentrierung von Bildunterschriften auf.

Das Bild ist als Einzelbild eingebunden und wurde über eine CSS- Klasse zentriert. Die Bildunterschrift war sonst immer mit dem linken Bildrand bündig. Wenn man das Fenster in der Größe ändert fällt auf, dass die Unterschrift den Platz gar nicht mehr wechselt. Sie ist also wie "festgeklebt". Woran kann das liegen? Es wurde von mit nicht so eingestellt.

Viele Grüße,
Maxel

[webster]

Hallo Maxel,

hast Du einen Link, wo man sich das Ganze mal ansehen kann?

[Maxel]

Hallo webster,

auf dieser Seite sollen die Bildunterschriften unter dem linken Rad bündig sein.
http://www.pferdehof-wiesengrund-web...en-anhalt.html

auf dieser Seite sollen die Bildunterschriften aber so bleiben, wie sie sind:
http://www.pferdehof-wiesengrund-web...nterricht.html

Der Code für die Einbindung eines Einzelbildes sieht so aus:

<div class="ce_image center block" style="margin-top:25px; margin-bottom:25px;">

<div class="image_container" style="padding-bottom:10;">
<a href="bildname.JPG" rel="lightbox">
<img src="bildnahme.jpg" width="600" height="450" alt="Pferdeschlitten vor Sonne" />
</a>
<div class="caption" style="width:600px">Pferdeschlitten</div>
</div>

</div>

Ich habe so die leise Vorahnung, dass das nicht so einfach möglich ist...

Viele Grüße,
Maxel

[webster]

Hallo Maxel,

dann wollen wir mal sehen:

da auf der Seite "Reitunterricht " nichts geändert werden soll, kümmern wir uns nur um die Styles für die Seite Reiterferien (css-id #reiterferien):

Zunächst einmal solltest Du die CSS-Klasse .center aus

<div class="ce_image center block">

entfernen und das Inline-CSS

style="width:600px;"

aus der caption entfernen.

Dann definierst Du folgendes CSS

#reiterferien .ce_image .image_container
{
 width: 600px;
 margin: 0 auto;
}

Noch etwas anderes:

padding-bottom:10

im image_container funktioniert ohne Angabe einer Einheit (px, em, ...) nicht.

[Maxel]

Hey webster,

vielen dank für deine Hilfe - es hat funktioniert.
http://www.pferdehof-wiesengrund-web...en-anhalt.html

Kannst du mir vielleicht noch mal erklären, wie das genau funktioniert? Ich hab jetzt mal drauf
geachtet; es gibt ein großen DIV- Container, der das gesamte main- DIV einschließt.


Viele Grüße,
Maxel

[webster]

Wie Du schon richtig bemerkt hast: Es gibt einen div-Container, der alles umschließt (also Bild und Bildunterschrift). Dem einfach die feste Breite zuweisen und mit margin:0 auto zentrieren.

[maipe]

Wer weiss wie es geht, ein anderer Thread ist schon etwas älter, deswegen probiers hier nocheinmal...