2013-04-01 28 views
2

我有以下jsFiddle。當我調整窗口大小時,跨度被分成兩行。我如何防止這種情況發生?我希望整個跨度能夠進入第二線。如何避免兩行中的跨度中斷內容?

<html> 
    <body> 
     <div id="dvContainer"> 
      <span style="border:1px;border-style:solid;margin-right:5px;padding:5px;">some text for the first span</span> 
      <span style="border:1px;border-style:solid;margin-right:5px;padding:5px;">second text for second span</span> 
     </div> 
    </body> 
</html> 

編輯:

我需要他們彼此相鄰,但是當我調整屏幕我想整個div來斷行,感謝

回答

17

您可以使用NOWRAP:

span{ 
    white-space: nowrap; 
} 
+1

這是一個正確的答案。其他選項包括:1)非標準的,但是普遍支持的'nobr'標記和2)用不間斷空格替換所有空格(但如果出現連字符或特殊字符,這並不總是足夠的)。通過在足夠窄的瀏覽器窗口中測試,可以將'display'設置爲'block'或'inline-block'不足*。 –

1

小更跨瀏覽器(我的意思是舊的IE和內嵌塊)

span { display:block; float:left }