CSS DIV緣移動，而不是內容

Question

整個DIV我有：

HTML

<div id="container"><div id="left"><div class="box">blahblah</div></div></div> 

CSS

.box { 
    height: 200px; 
    width: 300px; 
    margin: 50px; 
    background:url(box.png) no-repeat } 
#container{ 
    width:100%; 
} 
#left{ 
    float:left; 
    width: 260px; 
    height: 600px; 
} 

當我添加margin: 25px;到.box的類，它會將整個箱體整個頁面的div。 我應該怎麼做才能保證div（.box）內的內容（blahblah）？

Answer 1

如果我理解你的問題你只是在尋找替代padding: 25px; - 這增加了空間內箱的尺寸或周圍內容框和邊框邊緣

這裏是內一個簡單的模型，以幫助形象化的盒模型：

http://img199.imageshack.us/img199/4949/boxdim.png

看一看在CSS 2.1規格的盒型號部分：http://www.w3.org/TR/CSS2/box.html瞭解更多

Answer 2

你必須考慮到CSS使用而填充用於內部一個「盒子模型」

http://www.w3schools.com/css/css_boxmodel.asp

利潤率外部空間限制的事實。