2013-08-02 65 views
0

如果列數過多,引導程序表右邊框不會包裹表格,如小提琴中所示:http://jsfiddle.net/sCAUv/2/ 此處的示例中,右邊框在h18處停止。我想用它來包裝桌子。 關於如何解決這個問題的任何想法?Twitter靴帶表格邊框問題

<table class="table table-condensed table-bordered table-striped"> 
<thead> 
    <tr> 
     <th>h1</th> 
     <th>h2</th> 
     <th>h3</th> 
     <th>h4</th> 
     <th>h5</th> 
     <th>h6</th> 
     <th>h7</th> 
     <th>h8</th> 
     <th>h9</th> 
     <th>h10</th> 
     <th>h11</th> 
     <th>h12</th> 
     <th>h13</th> 
     <th>h14</th> 
     <th>h15</th> 
     <th>h16</th> 
     <th>h17</th> 
     <th>h18</th> 
     <th>h19</th> 
     <th>h20</th> 
     <th>h21</th> 
     <th>h22</th> 
     <th>h23</th> 
     <th>h24</th> 

    </tr> 
</thead> 
<tbody> 
    <tr> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
    </tr> 
    <tr> 
     <td>4</td> 
     <td>5</td> 
     <td>6</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>4</td> 
     <td>5</td> 
     <td>6</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
    </tr> 
    <tr> 
     <td>7</td> 
     <td>8</td> 
     <td>9</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>7</td> 
     <td>8</td> 
     <td>9</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
    </tr> 
</tbody>  

+4

它對我來說工作正常 –

+0

清除您的緩存請..不要發現任何問題... –

+0

與其他評論一樣,它適用於我 –

回答

0

我看到正是你的意思。問題是表不能被包裝。如果他們能夠,你怎麼知道它是溢出文本還是新行?

除非您想將表格拆分爲兩個單獨的表格,否則不可能避免這類問題。

對於其他人誰是好奇他的談論,看看這個截圖:

Verbose description of the original posters' issue.

在上面的截圖中,有一個水平滾動條,這可能是刺耳網站訪問者。

截至目前,沒有任何辦法來包裝桌子下沒有很多更多用戶的混淆而引起(這將是比具有滾動條更糟。

很多這問題可以通過修改屏幕分辨率,或table元素甚至字體大小來解決。如:

table { 
    font-size:90% !important; 
} 

也請記住,你應該保持!important改性劑,如Twitter的引導往往忽略了一些自定義CSS在部分例。

我不建議嘗試將表格包下來。它會變得非常不友好,並且可能與一個吸引人的網站形成鮮明對比。

+0

這不是我的意思。我的意思是把整個桌子都包在裏面。我的意思是讓邊界包裹桌子,即使滾動條不會發生在我身上......即使它似乎適用於大多數人 –

+0

@AnirudhaPatro再次,這是不可能的。 「看起來它適用於大多數人」,事實並非如此。他們不明白這個問題。 – 1234567