表不正确地考虑列宽

时间:2017-08-29 06:03:24

标签: html twitter-bootstrap

我已经在HTML中创建了一个表,在该表中我在表的最后一列中有多个列,如下图所示。 enter image description here

我已将表的最后一列分成另一个表的60列,但问题是在使用数字33的列之后它会忽略列的宽度。无论我做什么,它都会忽略宽度,即使我尝试使用内联样式设置但无法解决此问题。问题也在第二行继续,其中最后一列[再次分为60列]未识别宽度。我尝试设置每列的宽度,但它只是忽略宽度。那么问题是什么?

顺便说一下,我正在使用Bootstrap框架作为响应表。

这是同一张桌子的demo。任何人都可以帮我解决这个问题吗?

2 个答案:

答案 0 :(得分:1)

将以下CSS添加到您的css文件或页面标题中。希望这会对你有所帮助。

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

答案 1 :(得分:0)

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