html - 如何在 Bootstrap 流体容器内均匀分布一组相同宽度的盒子？

Question

如何在流体容器内均匀分布一组相同宽度的盒子？

我有以下内容:

<div class="fluid-container">
  <span>some text</span>
  <span>some text2</span>
  ...
  <span>some textN</span>
</div>

我想获得间隔均匀的盒子的结果，其中包含给定文本的每个粉红色盒子在蓝色流体容器内始终具有相同的宽度:

我尝试在其中设置盒子，但后来我在下一行中一个接一个地放置它们，没有最佳地使用横向空间:

如果我没有在文本中使用任何东西(比如我使用的 span)，那么流体容器就会发挥它的作用，但文本的间距不均匀(在这种情况下，黄色框是没有用任何东西包裹的文本标签):

我应该使用什么类/css 代码来组织和包装文本，以便产生相同宽度的框？盒子的数量未知。

Answer 1

http://getbootstrap.com/css/#grid

Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

<div class="row">
  <div class="col-md-4">text</div>
  <div class="col-md-4">text</div>
  <div class="col-md-4">text</div>
</div>