并排放置2盒[div]

马丁·菲舍尔（Martin Fischer）

我想将两个框（如您所见）并排放置在link的底部，两个文章框（div.content）并排放置，但是它们之间没有太大的距离。如何解决这个问题？

这是相关代码：

div.content {
    text-align: justify;
    color: #939393;
    padding: 25px 90px;
    margin: 0px auto 45px;
    width: 960px;
    border: 2px solid #F27F0E;
}

<div class="content-small" style="float: left;">

    <h2></h2>
    <ol class="posts"></ol>

</div>
<div class="content-small" style="float: right;">

    <h2></h2>
    <ol class="posts"></ol>

</div>

Abhinav高尼耶尔

您需要在两个方框中都应用左浮动，并将右边距设置为适当的值。

从中删除样式：

<div class="content-small" style="float: left;"></div>
<div class="content-small" style="float: right;"></div>

这样它们就变成了：

<div class="content-small"></div>
<div class="content-small"></div>

然后像这样更改您的css：

div.content-small {
    text-align: justify;
    color: #939393;
    padding: 25px 50px;
    margin: 0px auto 45px;
    width: 450px;
    border: 2px solid #F27F0E;
    float:left;        /* add this */
    margin-right:40px; /* add this and change value acc */
}

您也可以尝试在每个盒子上分别放置边距，以达到理想的效果

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。