1

我有两个 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%;
}
}
4

4 回答 4

1

如果要将主 div(包装器)居中,请像这样更改他的 css:

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

这将使主 DIV 包装器居中。

于 2013-11-11T16:19:45.727 回答
1

我无法重现您报告的问题。如果你看一下这个fiddle,你会发现一切正常。

这假设您也在复制/粘贴包装器div。如果这不是您想要的(并且您只想重复divs 内的 s wrapper),那么您需要确保使用classes 而不是ids for leftandright并且每个新行都会清除浮动。您可以通过clear: both.left课堂上实现这一点:

.left {
    clear:both;
    float:left;
    margin-right:1%;
}

你可以在这个小提琴中看到结果:

于 2013-11-11T16:32:54.580 回答
0

我通过删除重复的 div-id 并用 div-class 替换它们来解决问题

于 2013-11-20T18:27:10.643 回答
0

您可以通过做居中的主要 div #wrapper

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

或者您可以通过制作margin:0 auto;和移除来对齐中心margin-lef: auto; margin-right: auto;

于 2013-11-11T16:28:06.547 回答