Problem "Breite der Bildertabelle" innerhalb ce_gallery größer Breite ce_gallery

[uconac]

Hallo Alle zusammen,

nachdem ich nun schon drei Tage vergeblich versuche, ein Problem im Seitenlayout zu beheben, poste ich es hier im Forum.

In einer meiner Webseiten nutze ich in einem Layout mit Hauptbereich und rechter Spalte als Inhaltselement die Contao-Bildergalerie ce_gallery im Hauptbereich. Die Galerie enthält drei Bilder. Zwei davon werden vollständig dargestellt, und eines nur in etwa zur Hälfte.

Mittels Safari-Web-Inspector (Entwickler-Menü/Webinformationen einblenden) habe ich herausgefunden, daß ce_gallery mit einer Breite von 722px definiert ist. Dies entspricht der Breite des main-Bereichs. Die Bilder liegen als "Enkel" innerhalb einer Tabelle unterhalb von div "ce_gallery block". Die Tabelle besitzt eine Breite von 876px und ist somit größer als div "ce_gallery block" - weshalb das so ist, weiß ich nicht. Der Raum zur Darstellung der drei Bilder wird für jedes Bild mit 33% der Breite der Tabelle berechnet und jedes Bild entsprechend positioniert. Da der Darstellungsbereich für ce_gallery aber nur 722px breit ist, wird das dritte Bild abgeschnitten.

Die Tabelle müßte eigentlich dieselbe Breite wie ce_gallery besitzen, erbt die Breite aber offensichtlich nicht. Ich nehme an, dass wenn die Breite geerbt würde, die einzelnen Bereiche für die Bilder korrekt berechnet und die Bilder darin korrekt dargestellt würden. Mir ist es leider nicht gelungen, die Vererbung der Breite per css in meiner bildschirm.css (Aufbau wie in Peter Müllers Buch) hinzubekommen. Ich habe für die konkrete ce_gallery die id #ricohpin-gallery wie folgt definiert:

#ricohpin-gallery {
margin: 0;
padding: 0;
width: inherit;
background-color: blue;
}

und "ricohpin-gallery" in das Inhaltselement eingetragen. Aufgrund der in der Seite dargestellten Hintergrundfarbe Blau sehe ich, dass die css-Anweisung angezogen wird. Es wird jedoch der breitere Table-Bereich mit der Hintergrundfarbe versehen und wie die Bilder abgeschnitten.

Ich bin kein css-Experte. Vielleicht ist das ein einfaches Thema. Aufgrund der Beschreibungen eines Buchs über css3 habe ich bereits diverse css-Anweisungen ausprobiert. Keine meiner Ideen hat funktioniert. Habt Ihr eine Idee, wie ich die korrekte Breite für die Tabelle hinbekomme, so daß das dritte Bild nicht abgeschnitten wird? Für alle Hinweise oder konkrete Unterstützung herzlichen Dank!

Viele Grüße, uconac

P.s.
- Sowohl Safari als auch Firefox zeigen dasselbe Problem. Daher gehe ich davon aus, dass es nicht am Browser liegt.
- Ich setze Contao 2.11.3 unter Mac-OSX / MAMP ein.

[jubel]

Das Problem liegt im "overflow:hidden", das standardmäßig für das Block-Element Gallery definiert ist.
Da die Gesamtbreite nunmal durch das äußere Element vorgegeben ist, ändert man - soweit ich es verstanden habe - die Bildgröße der Gallery-Bilder so, dass sie alle in die Gesamtbreite passen.

[uconac]

Hallo jubel,

das overlay:hidden ist nicht das Problem. Die Bilder haben eine Breite von 200px und sollen einfach in die 722px Hauptspalte #main eingepasst werden. Die Hauptspalte ist der äußere Bereich für die Galerie. Um's griffiger zu machen, hier ein Ausschnitt:

contao-Bildbereichsclipping.jpg

Für die Galerie-interne Tabelle werden zur Berechnung der 33%-Bereiche (Zellen) für mich nicht nachvollziehbare 876px zugrundegelegt. Das ist das eigentliche Problem. Es führt dazu, dass je Bild eine Tabellenzellenbreite von 292px berechnet werden. Der Galeriebereich wird somit über die Hauptspalte hinausführt und abgeschnitten. Die in derselben Seite dargestellten ce_text-Blöcke werden vor Erreichen der rechten Spalte und innerhalb des 722px-Bereichs korrekt umgebrochen.

Ich benötige daher einen Tipp, der mir sagt, wie die Galerie bzw. deren interne Tabelle / Tabellenzeile die 722px der Hauptspalte erben. "width: inherit" hat wie beschrieben leider nicht funktioniert.

uconac

[jubel]

Möglicherweise sind noch irgendwelche Paddings versteckt (ohne Blick auf den Source kann ich nur raten).
Hast du's mal mit einer tabellenlosen Galerie probiert (benutze ich normalerweise)?

[uconac]

Wenn ich das Inhaltselement Galerie verwende, generiert Contao die HTML-Tabellen-Anweisungen. Da habe ich - glaub' ich zumindest - keinen Einfluß. Ausnahme natürlich durch Parametrisierung des Inhaltselements oder per css. Liege ich da falsch?

[uconac]

Hallo jubel,

ich habe den entscheidenden Hinweis nun in einem anderen Beitrag gefunden:

https://www.contao-community.de/show...ght=ce_gallery

An meine Konstellation angepasst sieht die Lösung wie folgt aus:

#ricohpin-gallery figure.image_container {
display: inline;
margin: 0;
background-color: blue;
}

Damit werden die Bilder direkt aneinandergereiht. Die Bildabstände lassen sich wie vorgesehen durch Angabe im Inhaltselement konfigurieren. Offensichtlich erben die Bilder Abstände, die dann die Tabellenzellen aufblähen und so zu einer zu großen Breite der Tabelle führen. Also genau andersherum als ich dachte!

Danke für's Unterstützen!

Uconac

[jubel]

Also doch die Abstände!

Als Alternative hier eine schöne Anleitung wie du zu einer tabellenlosen Galerie kommst:
http://www.think-contao.de/bildergal...ao-nutzen.html

[uconac]

Danke, das schau' ich mir mal genauer an! Könnte der Einstieg in die PHP-Programmierung sein Uconac