Grid nicht über ID einbinden, sondern über Klasse

[illplanet]

Im Moment ist es ja so, dass das Grid an den div-Container mit der ID "Wrapper" gebunden ist, was ja zur Folge hat, dass alles, was designtechnisch innerhalb der Artikel gestaltet wird, maximal die Breite des Wrappers annehmen kann.
Es geht mir um folgendes: ich möchte z.B einem Artikelelement eine Hintergrundgrafik zuweisen, die genau die Höhe dieses Elements einnimmt, aber über die Breite des eigentlichen Grids hinausgeht, um bei großen Displays weniger "leere" Fläche zu haben. Diese Hintergrundgrafik soll aber nicht die ganze Seite einnehmen - das ginge, indem ich die Hintergrundgrafik dem Body zuweise.
Mit Twitter Bootstrap wird sowas ja schön umgesetzt: hier ist das Grid mittels Klasse an einen div gebunden, der von einem weiteren umschlossen wird und das Hintergrundbild beinhaltet. Siehe http://expo.getbootstrap.com/.
Das Grid wird hier quasi je Inhaltselement "aufgerufen" und nicht nur einmal am Beginn der Seite. Das eröffnet einem gestalterisch ganz andere Möglichkeiten, als der klassische Wrapper, der alles umschließt. Hoffe ihr könnt nachvollziehen, was ich eigentlich meine...

Nun zur Frage, hat schon mal jemand von euch das Contao-Grid entsprechend angepasst?

[Lego2013]

Ich habe das gemacht, indem ich die fe_page.html angepasst habe und jedem Bereich, der volle Breite haben sollte, die ID wrapper zugewiesen. Du kannst das Problem aber m. E. mit den inneren und äusseren DIVs lösen. Da gab's hier im Forum schon Infos dazu.

[swinde]

Hallo Leo,

Ich habe das gemacht, indem ich die fe_page.html angepasst habe und jedem Bereich, der volle Breite haben sollte, die ID wrapper zugewiesen. Du kannst das Problem aber m. E. mit den inneren und äusseren DIVs lösen. Da gab's hier im Forum schon Infos dazu.

Das die ID Wrapper nur einmal je Seite vorkommen darf, ist dir aber bewusst!?

Es muss ja nicht zwingend der Wrapper sein, der die Breite des Gesamt Grids bestimmt. Sieh dir doch mal contao.org an, dort macht das die ID Container. Wrapper nimmt die gesamte Viewbreite ein.

Steffen Winde

[wulf]

keine ahnung,was mehr arbeit wäre, aber man kann auch problemlos das bootstrap.css einbinden und das fe_page template anpassen.

[Lego2013]

Das die ID Wrapper nur einmal je Seite vorkommen darf, ist dir aber bewusst!?

Ja, ist mir bewusst. Flüchtigkeitsfehler. Ich hatte die Wrapper-IDs mit Unterstrich ergänzt: z. B. #wrapper_head und #wrapper_footer.

[illplanet]

Ich hatte die Wrapper-IDs mit Unterstrich ergänzt: z. B. #wrapper_head und #wrapper_footer.

Dann arbeitest Du aber nicht mit dem 12Spalten-Grid.
Ja, ich könnte die Bootstrap.css direkt einbinden, das wirft aber zahlreiche weitere Probleme auf.

[Flex]

Eventuell leicht am Thema vorbei, aber vielleicht hilft es dir auch weiter.

http://www.contao-austria.at/blogrea...bootstrap.html

Gesendet von meinem Nexus 4 mit Tapatalk 4 Beta