0

ここに画像の説明を入力

ここで、「(även uppfinnare)」というテキストを一番上の行に表示します。現在それを行うHTMLは

<div class="data-box">   
            <div class="personName"><strong>    
                3. Kee Marcello&nbsp;
             </strong></div> 
        <div class="otherDetails">(även uppfinnare)</div> 

        <table border="0"><tr><td></td><td>Telefon</td><td>123</td></tr>
        <tr><td></td><td>Fax</td><td>123</td></tr>
        <tr><td></td><td>E-post</td><td>123</td></tr>
        <tr><td>null</td><td>Referens</td><td></td></tr>
        </table> 


    </div>

関連するCSSは

.data-box {
width:650px;
height:100px;
border:1px solid #cbcbcb;
}
.personName {     float:left;     width:300px;   }  
.otherDetails {     float:right;     width:450px;      }

手伝って頂けますか？ありがとう

4

3 に答える 3

1

.personNameとの両方に float left を適用し、幅がほぼ( ).otherDetailsであることを確認するか、横に並べた 2 つのサイズを縮小して、幅の合計が 650px を超えないようにします。.data-box750px300px + 450pxdiv

于 2012-04-16T13:00:07.850 に答える
1

容器に収まらないので落ちる。.data-box幅は 650 ピクセルで、.personName幅.otherDetailsの合計は 750 ピクセルになります

于 2012-04-16T13:00:50.877 に答える
1

両方の要素がフロートされ (右に 1 つ、左に 1 つ)、合わせて 750px を構成します。ただし、コンテナー要素の幅は 650px のみです。

浮動要素がスペースを使い果たすと、次の行にシャッフルされます。

子要素を小さくする (650px に収まるようにする) か、親要素を大きくする (750px)

于 2012-04-16T13:03:34.763 に答える