水平滾動條未顯示

我試圖顯示水平滾動條。但不是水平滾動條，它增加了div的高度，如果我改變overfolw-x：滾動到溢出：滾動它顯示我垂直滾動條。下面是代碼。提前致謝。水平滾動條未顯示

<html> 
<head> 
    <title></title> 
</head> 
<body> 
    <div id="main"> 
     <table style="width:800px; height:500px;border:1px solid black"> 
      <tr style="height:200px;border:1px dotted red;"> 
       <td>Test Text</td> 
      </tr> 
      <tr style="height:200px;border:1px dotted green;"> 
       <td> 
       <div style="width:100%;height:100%;overflow-x:scroll;"> 
        Hello this is a testing text to make sure that the division overflow. 
        Thanks for visiting. bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla blabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla blackbla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        blabla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla blackbla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla blabla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla blabla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla blabla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla 
        bla bla black bla bla bla bla bla bla bla bla bla bla bla bla bla bla 

       </div> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 
</html>

來源

2013-11-21 Zeb-ur-Rehman

它不是建議將div包含在td標籤中.....爲什麼不使用div而不是表格 – malcolmX

是的，但這是示例代碼克服問題。非常感謝您的建議。 –

您需要給div一個修復width。

我也用過：

.cont{ 
    white-space:nowrap; 
}

您可以使用<br>標籤，如果你想將文本分成多行：

檢查此琴：

http://jsfiddle.net/3Mjuu/3/

來源

2013-11-21 07:13:10 aBhijit

感謝您的解決方案abhijit。是的，在這種情況下，白人做了詭計。這是示例代碼，但在我的實際代碼中，我使用了圖像標籤的中繼器，因此沒有空白空間。 –

「圖像標籤的中繼器」是什麼意思？你能更新代碼來複制這個問題嗎？ – aBhijit

我的意思是包含圖像標籤以顯示圖像的中繼器。 –

水平滾動條未顯示

回答

相關問題