div水平滾動引導表不工作

在內容中，我把一個表格放在裏面。我需要它水平滾動。我花了數小時研究和嘗試一些解決方案。div水平滾動引導表不工作

<div style="width:100%; overflow: scroll;"> 
    <table style="width:2000px;"> 
      <tr> 
       <td>very large width table with scroll horizontal</td> 
       <td>x</td> 
       <td>x</td> 
       <td>x</td> 
      </tr> 
    </table> 
</div>

，而不是使用樣式

safari test

chrome test

div 1500 px

來源

2015-06-14 Marco Costa

你只是想能夠橫向滾動時桌子很寬，騎？因爲你的代碼已經爲我做了。或者我誤解了你的問題？ – SamuelMS

它似乎爲我工作 - https://jsfiddle.net/0k9a2h10/ - 你有什麼問題？如果在OS X上，知道默認行爲是不顯示滾動條。所以你不會看到它們，除非你切換該設置或添加假滾動條。通過觸摸板，我鏈接的JSFiddle水平滾動。 – Cymen

在這裏不起作用，有什麼可能是錯的？ –

由於您使用的引導，使用內置類。

<div class="table table-responsive"> 
    <table > //give width styling as you want. 
     <tr> 
      <td>very large width table with scroll horizontal</td> 
      <td>x</td> 
      <td>x</td> 
      <td>x</td> 
     </tr> 
    </table> 
</div>

這會給你一個水平滾動條。

來源

2015-06-14 05:58:57 Varun

這不是OP請求的水平滾動條 –

它確實創建了一個水平滾動條？ https://jsfiddle.net/DTcHh/8850/ – Varun

我的歉意也許我測試了一下錯了 –

起初，你應該爲表格的容器元素div元素添加類名「table-responsive」。

<div class="table-responsive"> 
    <table class="table table-bordered table-hover table-condensed small"> 
    /* table content here */ 
    </table> 
</div>

秒。如果你想，只有在一行中的表格中顯示的所有內容，而不軟wrap.you應該添加CSS樣式到您的樣式表如下內容大意是：

th,td{ 
    /*use this property to disbale soft wrap*/ 
    white-space: nowrap; 
    /*To make extra certain,add this css property*/ 
    word-break: keep-all; 

}

來源

2016-12-19 08:07:41 user3033075

div水平滾動引導表不工作

回答

相關問題