Question

需要一些帮助。

点击here并向下滚动到Print Marketing区块......这4个区块必须并排，但第4个区块由于某种原因而下降......

以下是该区域的代码块

<div class="eleven columns bottom-4">
    <h3 class="title">Print Marketing</h3>
<div class="five columns item element-2">
    <a href="#">
        <img src="images/img/sellers/slide1a.png" alt="" class="pic" />
    </a>
</div>
<!-- End -->

<!-- item 2 -->
<div class="five columns item element-2">
    <a href="#">
        <img src="images/img/sellers/slide1b.png" alt="" class="pic" />
    </a>
</div>
<!-- End -->
<!-- item 3 -->
<div class="five columns item element-2">
    <a href="#">
        <img src="images/img/sellers/slide1a.png" alt="" class="pic" />
    </a>
</div>
<!-- End -->

<!-- item 4 -->
<div class="five columns item element-2">
    <a href="#">
        <img src="images/img/sellers/slide1b.png" alt="" class="pic" />
    </a>
</div>
<!-- End -->


  </div>

CSS如下..

.container .columns {
float: left;
display: inline;
margin-left: 10px;
margin-right: 10px;
}
.container .five.columns {
width: 280px;
}
.container .eleven.columns {
width: 640px;
}

我已经尝试了很多东西。甚至给了他们一个内联样式，它也不起作用......任何想法，因为它们都有相同的类应用于它们，但一个块打破了所有其余的。

让我知道谢谢。

Answer 1

如果您尝试将div与这样的网格对齐，您可以随时尝试将div嵌套在表格中。

Answer 2

在第三个div块上，您需要添加clear:left;（内联或通过类）。

CSS对齐问题以块为单位

2 个答案: