Warum vergrößert sich Element durch padding?

[DeWitt]

Ich könnte natürlich diesen ungewollten Effekt wieder ausgleichen indem ich einfach die Leiste wieder insgesamt kleiner mache, aber ich verstehe grundsätzlich nicht warum ein Innenabstand auf der linken Seite die Leiste nach rechts "anwachsen" lächst....

Sagt dir der Begriff http://de.selfhtml.org/css/formate/box_modell.htm@title=Box-Modell etwas?

" Seit der CSS1-Spezifikation des W3-Konsortiums aus dem Jahre 1996 errechnet sich die Gesamtbreite eines Elements aus einer Addition

der  Breite des Elementinhalts (width),
des  Innenabstands (padding),
der  Rahmenstärke (border-width) und
des  Außenabstands (margin)."

Dein "Problem" ist also die W3-konforme Anzeige, und die "Problem"-Lösung hast du ja auch schon beschrieben. Allerdings spielt hier der IE wieder mal <http://de.selfhtml.org/css/formate/box_modell.htm#box_model_bug@title=nicht mit>, deswegen rate ich dir, für das Padding einen zweiten DIV-Container innerhalb des ersten zu platzieren und dessen padding auf den gewünschten Wert zu setzen.