Question

也许是因为我从早上10点开始就已经从模型中编写了一个页面，现在已经是凌晨1点30分了，但是我没有做什么让所有3个div都排在彼此旁边，并且它们之间的间隔为13px？最后2个浮动应该是，但第一个是有问题的。任何帮助表示赞赏。

页面在这里，3个div位于底部，为白色，带有蓝色超链接标题：http://sni-stage.scholastic.com/ezpublisher/index.cfm

我的css是：

.box1 {
   width:285px;
   height:141px;
   float:-left;
   background-image:url('/resource/uploads_scope/issues/images/at_A_glance_bottomBox.png');
}

.box2 {
   width:285px;
   height:141px;
   float:right;
   margin-left:13px;
   background-image:url('/resource/uploads_scope/issues/images/at_A_glance_bottomBox.png');
}

.box3 {
   width:285px;
   height:141px;
   float:right;
   margin-left:13px;
   background-image:url('/resource/uploads_scope/issues/images/at_A_glance_bottomBox.png');
}

感谢您的帮助： - ）

Answer 1

我不确定这只是一个错字。但我认为box1中的float: -left应为float:left

Answer 2

您可以考虑使用display:inline-block，而不是浮点数。

Answer 3

是的，同意了。 float：-left似乎是个问题。另外，在计算盒子的宽度时请小心。如果你将这3个盒子包裹在一个更大的div中，那么大div的宽度至少应该> （285 * 3）+（13 * 2）。 13是两个div上留下的余量。

为什么我的浮动DIVS不排队？

3 个答案: