Padding in Grid Elementen

[jeykon]

Hallo alle miteinander,

also ich bin momentan dabei meine Website responsive zu machen, mit dem 1140er % Grid von der Grid-Akademie.
Ich möchte die einzelne Artikel-Elemente gern farblich hinterlegen oder auch Rahmenlinien einfügen und dies natürlich mit inneren Abständen zum Text oder Bildern.

Leider lässt das C3 Grid keine Paddings zu, bzw. das Design verschiebt sich dann und das Grid passt nicht mehr.
Ich hatte jetzt in einem anderem Artikel gelesen, dass man einfach die inneren Elemente wie z.B. <p> anpassen soll.
Dies stellt für mich aber keine Lösung / Option dar. Hat da jemand einen Lösungsvorschlag wie ich den grid elementen Paddings verschaffen kann ohne das Layout zu crashen?

[wulf]

Vielleicht wäre box-sizing eine Lösung
http://css-tricks.com/almanac/properties/b/box-sizing/

[psren]

Leider lässt das C3 Grid keine Paddings zu, bzw. das Design verschiebt sich dann und das Grid passt nicht mehr.

Gilt auch für Rahmen.

Schau dir hierzu mal das Box-Model http://de.selfhtml.org/css/formate/box_modell.htm an.

-webkit-box-model: border-box;
   -moz-box-model: border-box;
           box-model: border-box;

Ist was dir hilft. Funktioniert aber erst ab ie8

Falls das somit ausfällt bleibt dir nur die Möglichkeit es mittels zweitem Element zu lösen.
Siehhe ".inside" bei Contao. Das ist genau dafür da.

[jeykon]

Vielen Dank für die Tipps, ich werde mich gleich damit beschäftigen.

Anderes Thema:
Ich würd dem #container gerne Schatten verpassen, die sind jedoch leider nicht sichtbar.
Hat jemand ne Idee wie ich das realisieren könnte?

[Spooky]

Vielen Dank für die Tipps, ich werde mich gleich damit beschäftigen.

Anderes Thema:
Ich würd dem #container gerne Schatten verpassen, die sind jedoch leider nicht sichtbar.
Hat jemand ne Idee wie ich das realisieren könnte?

Ist die Seite online verfügbar? Ansonsten können wir nur raten. Mein Rate-Versuch: #container hat overflow:hidden; und daher ist auch der box-shadow darauf nicht sichtbar.

[jeykon]

Vielen Dank, es lag an den Shadow Settings. Ich hatte nichts bei x-y Versatz eingetragen. Mit Werten hat es geklappt.