2012-04-16 78 views
0

enter image description here如何讓我的文字在頁面上呈現得更高?

現在我想要文本「(ävenuppfinnare)」顯示在第一行。那現在它的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;  } 

你能幫助我嗎?由於

+1

正如其他人所建議的兩個div標籤不進去的空間,當你浮動元素首先嚐試儘可能高,然後根據屬性嘗試向左或向右移動。 – Dale 2012-04-16 13:05:47

回答

1

適用浮動左既.personName.otherDetails並確保.data-box寬度幾乎750px300px + 450px)或僅減少2並排側div所以他們的寬度之和不寬於650像素的大小

+0

謝謝。有用。 – 2012-04-16 13:18:09

1

它掉下來,因爲它不適合在容器上。 .data-box是650px寬度,.personName.otherDetails寬度總和可達750px

1

你的元素都是浮動的(右邊一個,左邊一個),它們一起構成750px。但容器元素只有650px寬。

當浮動元素用盡空間時,它們會被混洗到下一行。

要麼使孩子們元素較小(以適應650像素),或使父母大(750px)

相關問題