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 に答える