WP 3.0.4启用多站点网络，使用MAMP本地安装，PHP 5.3.2，WP主题：Twentyten Child (Wordpress Theme)

无法在div容器中显示4个div框水平对齐的CSS样式。

注意：在我手工编写的HTML/php网站上，同样的css样式可以很好地用于HTML 4.01 Transitional//EN。但在我的WordPress网站上，这四个盒子像楼梯一样从对方身上下来。

Firefox v3中的行为相同。6.13和Safari v5。0.3。

My CSS:

部门。长方体容器{显示：内联；边距：0.63em 0pt；填充：10px；宽度：640px；背景颜色：rgb（229231225）；位置：相对；浮点：左；溢出：隐藏；}

迪夫。小方框{边框：1px实心rgb（153、51、102）；边距：10px 5px；填充：0.325em；浮动：左；背景颜色：rgb（255、244、227）；宽度：128px；线宽：0.85em；最大高度：8em；最小高度：8em；位置：相对；}

My HTML:

<；div class=“盒式集装箱”>；

<；div class=“小盒子”>；某些文本（&A）；图像（</div>；

<；div class=“小盒子”>；某些文本（&A）；图像（</div>；

<；div class=“小盒子”>；某些文本（&A）；图像（</div>；

<；div class=“小盒子”>；某些文本（&A）；图像（</div></div>；

box container div width指定为640px，但我注意到填充将其扩展到了这个范围之外。

在任何情况下，它都足以容纳四个小盒子，总共512px加上它们的总40px边距，再加上盒子容器div上的20px填充。

My Problem:

我不明白为什么填充会推高盒子容器div的大小。当我尝试使用最大宽度640px时，我观察到盒子都垂直排列，盒子容器div的宽度不超过170px。编辑：填充已从box container div中删除，并在小box div上调整了边距。

真正的问题如前两段所述：四个小盒子像楼梯一样从彼此身上下来。我希望它们水平对齐。

小方框div实际上大小都相同，其内容由文本和；形象

帮助

Edit:

我的手动编码网站截图，表现如预期：

我在WordPress中看到的楼梯效果我的WordPress主题：

<div style="width:200px; height: 200px; background: red; padding: 10px;">
220x220
</div>

<div style="width:200px; height: 200px; background: green;">
<div style="padding: 10px;">
200x200
</div>
</div>