Felix Riesterer: scrollbalken bei padding

Beitrag lesen

Lieber Henry,

üblicherweise bezieht sich width auf das, was ohne padding und margin übrig bleibt. Diese Berechnungsweise ist der default, wenn man box-sizing bei content-box belässt.

width:100%;
padding:4%;

Du nimmst für den Inhalt die vollen 100% und gibst zuzüglich rechts und links (und oben und unten) noch jeweils 4% dazu, was eine Gesamtbreite von 108% bedeutet. Wenn da noch vererbte margin-Werte dazu kommen, ist es noch mehr.

Letzendlich fand ich dann: box-sizing:border-box;

In meinen Augen ist das eher ein Hack, als eine Lösung, denn hier wird der Quirksmode des Internet-Explorers emuliert. Man kann das wohl mittlerweile "einfach" benutzen. "Früher" hat man dann eben die Breite berechnet: width: calc(100% - 4% - 4%); - auch wenn das hier eher doof aussieht, aber wenn padding mit einer anderen Einheit angegeben würde, sähe das schon anders aus: width: calc(100% - 4em - 4px);

Ich verstehe zwar immer noch nicht genau, warum die Browser ansonsten ein Berechnungsproblem haben, doch damit funktionierts zumindest.

Dafür verstehe ich noch immer nicht genau, warum Du Dich in diese Dinge nicht genauer einliest. Es ist ja nicht so, als erklärte das Wiki das Box-Modell nicht in aller Ausführlichkeit...

Liebe Grüße

Felix Riesterer