<h3>Mijn biedingen</h3>
<table class="table table-responsive">
<thead>
<tr>
<th>nummerplaat</th>
<th>Bod</th>
<th>Status</th>
<th>Datum bod</th>
<th>Aankoopdatum</th>
</tr>
</thead>
<tbody>
<tr>
<td>THOMAS</td>
<td>€ 90 000,00</td>
<td>open</td>
<td>15/10/2014</td>
<td>
Niet beschikbaar
</td>
</tr>
</tbody>
</table>
这是我的代码,这是结果:https://www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014-10-15%2019.28.09.png?dl=0
我怎样才能在一条线上得到TD的钱?该网站是响应式的,但由于文本中的空格,文本变成了两行。
最佳答案
如果你想让文本在同一行使用CSS样式
white-space:nowrap;
例如:
<span class="nowrap">Your text here</span>
在CSS样式表中
.nowrap {
white-space:nowrap;
}
Bootstrap 实现方式
因为你已经有了bootstrap,不需要类定义,你可以使用class text-nowrap
只需在您的 td 中尝试此操作,或者如果不起作用,请尝试添加 span
围绕您的文本并分配 class
例如:
<td class="text-nowrap"> Your text </td>
或
<td> <span class="text-nowrap">Your text </span></td>
也可以放在table标签中,这样就不需要在每个元素中都添加了
例如:<table class="text-nowrap"> .... </table>
在 Bootstrap 中有更多相关信息 documentation在对齐类下检查
Bootstrap 4 文档 here
Bootstrap 5 文档 here
关于css - Bootstrap 表没有换行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26388593/