twitter-bootstrap 如何在 Bootstrap 中获得自动宽度列？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/39677027/
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
How can I get auto-width-columns in Bootstrap?
提问by Hyman
How do I get auto-width-columns in Bootstrap like in UIKit?
如何像在 UIKit 中一样在 Bootstrap 中获得自动宽度列？
I need 5 columns with auto width.
我需要 5 列具有自动宽度。
In UIKit you get it with <div class="uk-width-1-5">
在 UIKit 你得到它 <div class="uk-width-1-5">
I find only cumbersome workarounds.
我发现只有繁琐的解决方法。
Thanks
谢谢
回答by Josh Bradley
Bootstrap 4+ you can use the col class alone and it will resize to what space is available.
Bootstrap 4+ 您可以单独使用 col 类，它会调整到可用空间的大小。
<div class="row">
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</div>
回答by Muhammad Altabba
Using class="col"will automatically make the columns equal in size.
使用class="col"将自动使列的大小相等。
But if you want some column(s) to resize depending on its/there content(s), use something like class="col-auto".
但是，如果您希望某些列根据其/那里的内容调整大小，请使用类似class="col-auto".
Use
class="col-{breakpoint}-auto"classes to size columns based on the natural width of their content.Reference: https://getbootstrap.com/docs/4.0/layout/grid/#variable-width-content
使用
class="col-{breakpoint}-auto"类根据内容的自然宽度调整列的大小。参考：https: //getbootstrap.com/docs/4.0/layout/grid/#variable-width-content
回答by Zim
The 5 columns aspect of this question has been answered here
此问题的 5 列方面已在此处回答
Since Bootstrap has 12 columns, you only use 10 of them with 5 col-*-2units
由于 Bootstrap 有 12 列，因此您只使用其中的 10 列和 5 个col-*-2单位
http://www.codeply.com/go/QXiPmtgJUJ
http://www.codeply.com/go/QXiPmtgJUJ
<div class="row">
<div class="col-md-2 col-md-offset-1"></div>
<div class="col-md-2"></div>
<div class="col-md-2"></div>
<div class="col-md-2"></div>
<div class="col-md-2"></div>
</div>
In terms of "auto-width", I'm not sure exactly what you mean. Bootstrap 4 will have new auto-layout columnsthat consume the remaining portion of any row, but this is still based on a 12 column grid.
就“自动宽度”而言，我不确定您的意思。Bootstrap 4 将有新的自动布局列，这些列会占用任何行的剩余部分，但这仍然基于 12 列网格。
