-
Bilder zentrieren
Hallo,
ich möchte die Bilder zentrieren, was ich mit dem folgenden Code erreicht habe.
HTML-Code:
.caroufredsel_gallery .image_container img {
margin: auto;
}
Allerdings spinnt die Darstellung in Firefox und Endge, sobald man die Bilder vergrößert und die Lightbox wieder schließt. Dann stimmt es nicht, was man unten anklickt und oben gezeigt wird. Woran liegt es?
http://www.ingoschiller.net/de/fotos/orte.html
Liebe Grüße,
Jan
-
Evtl. liegt das daran, dass Blockelemente in Inlineelementen normalerweise verboten sind. Du hast da aber
HTML-Code:
block <figure>
inline <a>
inline <picture>
block <img>
Versuch mal diese As und PICTURE auf display:block; zu setzen. Vielleicht geht es dann ja.
-
Danke. Ich habe es gesetzt. Leider werden immer noch falsche Bilder in der Mitte gezeigt, nachdem ich einige vergrößert in der Lightbox angeschaut habe. Danach stimmt das nicht überein, was man unten anklickt und was oben gezeigt wird - im Quellcode steht aber die CSS-Klasse visible bei dem richtigen Bild, dieses ist allerdings auf der "Bühne" nicht sichtbar. Woran kann das liegen?
-
Also ein Fehler ist schon mal weg, die Bilder waren bei mir nach dem Schließen der Lightbox nicht mehr zentriert.
Hast du angepasstes CSS für Caroufredsel und die Colorbox? Wenn ja, dann probier erst nochmal mit dem original CSS.
Da ist ein sehr seltsamer Effekt
HTML-Code:
<div class="caroufredsel_wrapper">
<div class="caroufredsel">
div.caroufredsel_wrapper ist position:relative und div.caroufredsel ist position:absolute mit left:0, aber nach dem Schließen der Lightbox orientiert er sich nicht mehr an seinem Parent. Wenn du dann diese Breite vom ihm (81000px) in den Dev-Tools ausschaltest und wieder einschaltest, stimmt die Orientierung wieder. Außer, dass dies ein Browserbug sein könnte fällt mir im Moment nichts dazu ein.
Versuch mal testweise die mediabox anstatt der colorbox dort zu verwenden.
-
Danke. Es ist wirklich komisch. Mit mediabox gibt es kein Problem. Ich habe für colorbox auch clear: both eingestellt. Das hat leider auch nicht geholfen. Hast du eine Idee, womit ich das noch beeinflussen könnte? Ungerne lade ich beide Javascriptbibliotheken, daher wäre es toll nur jQuery zu verwenden.
-
Ist vermutlich das selbe oder ähnliche Problem wie bei mir. Siehe hier ...
-
Super, vielen Dank. Das hat geholfen und es funktioniert wie erwartet.