[解決済み] DIVのpaddingをwidth/heightに影響を与えずに変更するには？

質問

DIVの幅と高さを固定で指定し、さらに元のDIVの幅と高さを減らしたり増やしたりせずに変更できるpaddingを指定したいのですが、そのためのCSSトリック、またはpaddingを使った代替手段はありますか？

どのように解決するのですか？

解決策は で囲むことです。 で囲むことです。 固定幅の外側の div

HTML

<div class="outer">
    <div class="inner">

        <!-- your content -->

    </div><!-- end .inner -->
</div><!-- end .outer -->

CSS

.outer, .inner {
    display: block;
}

.outer {
    /* specify fixed width */
    width: 300px;
    padding: 0;
}

.inner {
    /* specify padding, can be changed while remaining fixed width of .outer */
    padding: 5px;
}