2

有点模糊。我使用新闻系统，在左侧我想从世界获取新闻，在右侧我不会从我的国家获取新闻。这个问题我真不知道怎么解决：http://i48.tinypic.com/15rxzkw.jpg

资源：

<div style="width:1000px;">
    <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/><br/>

 <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/><br/>

  <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/><br/>

   <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/> <br/>

   <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/><br/>


    <div style="border:1px solid red;float:left;width:400px;">news from world</div><br/><br/>
    <div style="border:1px solid blue;width:400px;float:right;">news from my country</div><br/><br/>
    <div style="border:1px solid blue;width:400px;float:right;">news from my country</div><br/><br/>
    <div style="border:1px solid blue;width:400px;float:right;">news from my country</div><br/><br/>
</div>
4

3 回答 3

3

您需要清除浮动 div。把这个：

<div style="clear: both;"></div>

http://www.quirksmode.org/css/clearing.html

例如：

<div style="width:1000px;">
<div style="border:1px solid red;float:left;width:400px;">aaaaaaaa</div>
<div style="border:1px solid blue;width:400px;float:right;">bbbbbbb</div>
<div style="clear: both"></div>
<div style="border:1px solid blue;width:400px;float:left;top:0px;">cccccccc</div>
<div style="border:1px solid blue;width:400px;float:right;">dddddddddd</div>
</div>
于 2013-01-09T23:44:27.790 回答
1

其原因在于<br /><br />

删除它们，因为它们将元素 2,3 和 4 2 规则向下推。

还尝试将样式与您的 html 分开，并且永远不要<br />用于样式。（W3C 语义）

于 2013-01-09T23:43:46.417 回答
0

你可以试试这个：

    <div style="width:1000px;">

   <div style="float:left;">
    <div style="border:1px solid red;width:400px;">aaaaaaaa</div><br/><br/>
    <div style="border:1px solid blue;width:400px;">bbbbbbb</div>
    </div>
     <div style="float:left;">
    <div style="border:1px solid blue;width:400px;top:0px;">cccccccc</div>
    <div style="border:1px solid blue;width:400px;">dddddddddd</div>
    </div>

    </div>
于 2013-01-09T23:46:45.823 回答