CSS 引导表没有换行
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/26388593/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap table no new line
提问by Stijn Hoste
<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>
This is my code, this is the result: https://www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014-10-15%2019.28.09.png?dl=0
这是我的代码,这是结果:https: //www.dropbox.com/s/6vkc2mpu7z4yqgq/Screenshot%202014-10-15%2019.28.09.png?dl=0
How can I have the money TD on one line? This website is responsive but the the text becomes in two lines because of the spaces in the text.
我怎样才能在一条线上获得资金 TD?这个网站是响应式的,但由于文本中有空格,文本变成了两行。
回答by kiranvj
If you want to have the text in same line use CSS style
如果你想让文本在同一行使用 CSS 样式
white-space:nowrap;
eg:
例如:
<span class="nowrap">Your text here</span>
In CSS style sheet
在 CSS 样式表中
.nowrap {
white-space:nowrap;
}
Bootstrap way of doing it
Bootstrap 的做法
Since you already have bootstrap, no need of class definition, you can use class text-nowrap
既然你已经有了 bootstrap,不需要类定义,你可以使用 class text-nowrap
Just try this in your td or if doesn't work try adding a span
around your text and assign the class
只需在您的 td 中尝试此操作,或者如果不起作用,请尝试span
在您的文本周围添加一个并分配class
eg:
例如:
<td class="text-nowrap"> Your text </td>
or
或者
<td> <span class="text-nowrap">Your text </span></td>
You can also have it in the table tag,so that no need to add in each element
你也可以把它放在table标签中,这样就不需要在每个元素中添加
eg: <table class="text-nowrap"> .... </table>
例如: <table class="text-nowrap"> .... </table>
More on this in Bootstrap documentationCheck under Alignment classes
在 Bootstrap文档中查看更多关于对齐类的检查
Bootstrap 4 documentation here
Bootstrap 4 文档在这里
回答by Barry
Use
instead of space
使用
代替空间