2017-08-29 61 views
1

我已經在HTML中創建了一個表格,在表格的最後一列中有多列,如下圖所示。 enter image description here表不正確地適應列寬

我已經把表格的最後一列分成另一個表格的60列,但問題是,在編號爲33的列之後,它忽略了列的寬度。無論我做什麼,它都會忽略寬度,即使我試圖用內聯風格設置它,但無法解決此問題。第二行還存在問題,最後一列[又分爲60列]沒有識別寬度。我試着設置每列的寬度,但它只是忽略了寬度。那麼問題是什麼?

順便說一句,我使用響應表的Bootstrap框架。

下面是同一張表的demo。誰能幫我這個??

+0

任何人都可以提出一些建議嗎? – YogY

回答

1

添加以下CSS到你的CSS文件或網頁的標題。希望這會幫助你。

table .incrementValue { 
    min-width: 47px; 
} 
+1

完美運作。感謝您的幫助 – YogY

0

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
    <table class="table table-bordered table-striped"> 
 
\t   <thead> 
 
\t   <tr> 
 
\t   <th class="text-center">S.No.</th> 
 
\t   <th class="text-center">center name</th> 
 
\t   <th class="text-center">batch size</th> 
 
\t   <th class="text-center">status</th> 
 
\t   <th class="text-center"> 
 
\t    <table class="table table-bordered table-striped" style="margin-bottom: 0"> 
 
\t    <thead> 
 
\t     <tr> 
 
\t     <th style="width: 3%;">1</th> 
 
\t     <th style="width: 3%;">2</th> 
 
\t     <th style="width: 3%;">3</th> 
 
\t     <th style="width: 3%;">4</th> 
 
\t     <th style="width: 3%;">5</th> 
 
\t     <th style="width: 3%;">6</th> 
 
\t     <th style="width: 3%;">7</th> 
 
\t     <th style="width: 3%;">8</th> 
 
\t     <th style="width: 3%;">9</th> 
 
\t     <th style="width: 3%;">10</th> 
 
\t     <th style="width: 3%;">11</th> 
 
\t     <th style="width: 3%;">12</th> 
 
\t     <th style="width: 3%;">13</th> 
 
\t     <th style="width: 3%;">14</th> 
 
\t     <th style="width: 3%;">15</th> 
 
\t     <th style="width: 3%;">16</th> 
 
\t     <th style="width: 3%;">17</th> 
 
\t     <th style="width: 3%;">18</th> 
 
\t     <th style="width: 3%;">19</th> 
 
\t     <th style="width: 3%;">20</th> 
 
\t     <th style="width: 3%;">21</th> 
 
\t     <th style="width: 3%;">22</th> 
 
\t     <th style="width: 3%;">23</th> 
 
\t     <th style="width: 3%;">24</th> 
 
\t     <th style="width: 3%;">25</th> 
 
\t     <th style="width: 3%;">26</th> 
 
\t     <th style="width: 3%;">27</th> 
 
\t     <th style="width: 3%;">28</th> 
 
\t     <th style="width: 3%;">29</th> 
 
\t     <th style="width: 3%;">30</th> 
 
\t     <th style="width: 3%;">31</th> 
 
\t     <th style="width: 3%;">32</th> 
 
\t     <th style="width: 3%;">33</th> 
 
\t     <th style="width: 3%;">34</th> 
 
\t     <th style="width: 3%;">35</th> 
 
\t     <th style="width: 3%;">36</th> 
 
\t     <th style="width: 3%;">37</th> 
 
\t     <th style="width: 3%;">38</th> 
 
\t     <th style="width: 3%;">39</th> 
 
\t     <th style="width: 3%;">40</th> 
 
\t     <th style="width: 3%;">41</th> 
 
\t     <th style="width: 3%;">42</th> 
 
\t     <th style="width: 3%;">43</th> 
 
\t     <th style="width: 3%;">44</th> 
 
\t     <th style="width: 3%;">45</th> 
 
\t     <th style="width: 3%;">46</th> 
 
\t     <th style="width: 3%;">47</th> 
 
\t     <th style="width: 3%;">48</th> 
 
\t     <th style="width: 3%;">49</th> 
 
\t     <th style="width: 3%;">50</th> 
 
\t     <th style="width: 3%;">51</th> 
 
\t     <th style="width: 3%;">52</th> 
 
\t     <th style="width: 3%;">53</th> 
 
\t     <th style="width: 3%;">54</th> 
 
\t     <th style="width: 3%;">55</th> 
 
\t     <th style="width: 3%;">56</th> 
 
\t     <th style="width: 3%;">57</th> 
 
\t     <th style="width: 3%;">58</th> 
 
\t     <th style="width: 3%;">59</th> 
 
\t     <th style="width: 3%;">60</th> 
 
\t     </tr> 
 
\t    </thead> 
 
\t    </table> 
 
\t   </th> 
 
\t   </tr> 
 
\t   </thead> 
 
\t   <tbody> 
 
\t   <tr> 
 
\t    <td>Lipsum Website</td> 
 
\t    <td><a href="http://www.lipsum.com">www.lipsum.com</a></td> 
 
\t    <td>100</td> 
 
\t    <td>done</td> 
 
\t    <td> 
 
\t    <table class="table table-bordered table-striped" style="margin-bottom: 0"> 
 
\t     <thead> 
 
\t     <tr> 
 
\t     <th style="width: 3%;">101</th> 
 
\t     <th style="width: 3%;">102</th> 
 
\t     <th style="width: 3%;">103</th> 
 
\t     <th style="width: 3%;">104</th> 
 
\t     <th style="width: 3%;">105</th> 
 
\t     <th style="width: 3%;">106</th> 
 
\t     <th style="width: 3%;">107</th> 
 
\t     <th style="width: 3%;">108</th> 
 
\t     <th style="width: 3%;">109</th> 
 
\t     <th style="width: 3%;">110</th> 
 
\t     <th style="width: 3%;">111</th> 
 
\t     <th style="width: 3%;">112</th> 
 
\t     <th style="width: 3%;">113</th> 
 
\t     <th style="width: 3%;">114</th> 
 
\t     <th style="width: 3%;">115</th> 
 
\t     <th style="width: 3%;">116</th> 
 
\t     <th style="width: 3%;">117</th> 
 
\t     <th style="width: 3%;">118</th> 
 
\t     <th style="width: 3%;">119</th> 
 
\t     <th style="width: 3%;">120</th> 
 
\t     <th style="width: 3%;">121</th> 
 
\t     <th style="width: 3%;">122</th> 
 
\t     <th style="width: 3%;">123</th> 
 
\t     <th style="width: 3%;">124</th> 
 
\t     <th style="width: 3%;">125</th> 
 
\t     <th style="width: 3%;">126</th> 
 
\t     <th style="width: 3%;">127</th> 
 
\t     <th style="width: 3%;">128</th> 
 
\t     <th style="width: 3%;">129</th> 
 
\t     <th style="width: 3%;">130</th> 
 
\t     <th style="width: 3%;">131</th> 
 
\t     <th style="width: 3%;">132</th> 
 
\t     <th style="width: 3%;">133</th> 
 
\t     <th style="width: 3%;">134</th> 
 
\t     <th style="width: 3%;">135</th> 
 
\t     <th style="width: 3%;">136</th> 
 
\t     <th style="width: 3%;">137</th> 
 
\t     <th style="width: 3%;">138</th> 
 
\t     <th style="width: 3%;">139</th> 
 
\t     <th style="width: 3%;">140</th> 
 
\t     <th style="width: 3%;">141</th> 
 
\t     <th style="width: 3%;">142</th> 
 
\t     <th style="width: 3%;">143</th> 
 
\t     <th style="width: 3%;">144</th> 
 
\t     <th style="width: 3%;">145</th> 
 
\t     <th style="width: 3%;">146</th> 
 
\t     <th style="width: 3%;">147</th> 
 
\t     <th style="width: 3%;">148</th> 
 
\t     <th style="width: 3%;">149</th> 
 
\t     <th style="width: 3%;">150</th> 
 
\t     <th style="width: 3%;">151</th> 
 
\t     <th style="width: 3%;">152</th> 
 
\t     <th style="width: 3%;">153</th> 
 
\t     <th style="width: 3%;">154</th> 
 
\t     <th style="width: 3%;">155</th> 
 
\t     <th style="width: 3%;">156</th> 
 
\t     <th style="width: 3%;">157</th> 
 
\t     <th style="width: 3%;">158</th> 
 
\t     <th style="width: 3%;">159</th> 
 
\t     <th style="width: 3%;">160</th> 
 
\t     </tr> 
 
\t     </thead> 
 
\t    </table> 
 
\t    </td> 
 
\t   </tr> 
 
\t   </tbody> 
 
\t  </table>