Question

我有两个div，一个放在左边，一个放在右边。在左边div我有文字，在右边div我有图像。当我复制并粘贴下面的HTML并重复相同的div行时，div只是偏离中心。这是为什么？这是我的代码 -

HTML -

<div id="wrapper">
    <div id="left">

    <br><br>

    <CENTER> TEXT</CENTER></div>
    <div id="right">

    <br><br>

        <font-size: "14px;">

            IMAGE 
            IMAGE
            IMAGE
            <br><br>

        </td>
    </tr>
</div>

CSS -

#wrapper {
    width: 100%;
    overflow: auto;
}

#left {
    float:left;width:48%;margin-right:1%;
}

#right {
    float:right;width:48%;margin-left:1%;
}
}

Answer 1

如果你想将主div（包装器）居中，那就改变他的css：

#wrapper{
width:980px /*Could be any width*/
margin:0 auto;
}

这将使主DIV包装器居中。

Answer 2

我无法重现您报告的问题。如果您查看此fiddle，您会发现一切正常。

这假设您也复制/粘贴包装器div。如果那不是您想要的（并且您只想重复div内的wrapper），那么您需要确保使用class而不是{{1} } {}为id和left，并为每个新行清除浮动。您可以通过right类{/ p>上的clear: both来实现此目的

.left

您可以在this fiddle中看到结果：

Answer 3

主要的div #wrapper可以通过

来集中

#wrapper{ 
 width: 980px; /*1024, percentage*/
 margin-left: auto; 
 margin-right: auto;
}

或者您可以通过制作margin:0 auto;并删除margin-lef: auto; margin-right: auto;

来对齐

Answer 4

我通过删除重复的div-id并用div-class

替换它来解决问题

Div不是中心对齐

4 个答案: