我正在开发一个包含嵌套内容的引导表,如下所示
<table class="table table-bordered">
<thead>
<tr>
<td>Name</td>
<td>value</td>
</tr>
</thead>
<tbody>
<tr>
<td>hello</td>
<td>
<tr><td>0</td></tr>
<tr><td>1</td></tr>
<tr><td>2</td></tr>
<tr><td>3</td></tr>
<tr><td>4</td></tr>
<tr><td>5</td></tr>
<tr><td>6</td></tr>
<tr><td>7</td></tr>
<tr><td>8</td></tr>
<tr><td>9</td></tr>
<tr><td>10</td></tr>
</td>
</tr>
</tbody>
</table>
这些嵌套内容垂直显示。我需要一种方法来检测<td>
的高度。比方说50px,一旦超出限制,<tr>
内的<td>
将水平对齐。
要注意表是通过递归函数生成的,它的想法是构造一个树表。但节省空间是我的首要任务。
答案 0 :(得分:1)
您应该使用其他标记,例如div
而不是tr
。 tr
总是决定换行。
如果您使用的是bootstrap,则可以将class="row"
用于外部td,将class="col-sm-2/3//...n"
用于内部div
或其他元素。这样它就可以水平对齐。