テキストをページ上でより上にレンダリングする方法は？

Question

ここで、テキスト "（ävenuppfinnare）"を一番上の行に表示します。それが今

<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> 

あるんHTML関連のCSSは

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

あなたは私を助けることができるであること？おかげ

Answer 1

は、フロートを適用するので、その幅の合計が650pxよりも幅広でない.personNameと.otherDetailsの両方を残し、.data-box幅は、ほぼ750px（300px + 450px）またはわずか2サイド・バイ・サイドdivのサイズを小さくしていることを確認します

Answer 2

容器に収まりませんので落ちます。 .data-boxは650pxの幅、および.personNameと（左に右に1、1）両方ともあなたの要素を浮かべている750px

Answer 3

まで.otherDetails幅の合計である、と一緒に彼らは750pxを構成しています。コンテナエレメントの幅はわずか650pxです。

浮動小数点型の要素の空きがなくなると、次の行にシャッフルされます。あなたは要素それ最初の試行をフロートするとき

いずれか他の人が2個のdivタグを示唆してきたように（750px）