Aloha ;)
Verstehe ich nicht.
Wieso rendert der Browser 100% plus 2em (lt. padding)? Das ergibt überhaupt keinen Sinn, zumal er das nur am rechten Rand macht. Und das
padding:1em
soll ja nach innen wirken, also für den Text der drinnen steht.
Hättest du den von mir verlinkten Text gelesen, wüsstest du, dass im Standard-Box-Modell die width nur für den Inhalt steht, Padding und Border werden also nicht mit eingeschlossen. Daher ist die tatsächliche Größe der Box eben größer als width, sofern sie padding oder border besitzt. Außer du änderst das angewandte Box-Modell via box-sizing. Warum das nur am rechten Rand geschieht ist genauso klar: weil es dem Standardverhalten entspricht, übergroße Elemente rechts und unten über den verfügbaren Platz ragen zu lassen.
Aber warum auch lesen was ich dir verlinke?
Grüße,
RIDER