Question

css+DIV padding属性问题，为何它占用两个DIV之间的距离？

<div id="Nav2" style="width:960px; height:50px;float:left; background:url(NAV_B_1.png)">
<div id="Logo1" style="width:230px;float:left; padding-top:10px;padding-left:10px;margin:0;"><img src="/m2bang/LOGO_T_1.png" width="206" height="29" /></div>
<div id="Nav_main" style="width:730px;float:left;margin:0;"></div>
</div>

---------------
以上代码贴到BODY中，可见LOGO-DIV实际宽度超过了230，以至于nav_main-DIV会被挤到下面

请问为什么会这样呢？

Answer 1

div默认是占一整行的，要有display:block;或display:inline-block;才能设置宽度。
<div id="Nav2" style="display:block;width:960px; height:50px;float:left; background:url(NAV_B_1.png)">
<div id="Logo1" style="display:inline-block;width:230px;float:left; padding-top:10px;padding-left:10px;margin:0;"><img src="/m2bang/LOGO_T_1.png" width="206" height="29" /></div>
<div id="Nav_main" style="display:block;width:730px;float:left;margin:0;"></div>
</div>

Answer 2

楼上解析有误。div是块，默认属性就是display:block;
产生的原因是因为：padding-left:10px;
LOGO-DIV实际宽度是width+padding-left=240px
解决方法：padding-left:10px;去掉。

追问

后来查资料才知道padding属性对宽高有影响。