Problem "Breite der Bildertabelle" innerhalb ce_gallery größer Breite ce_gallery
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.
Liste der Anhänge anzeigen (Anzahl: 1)
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:
Anhang 7864
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
