javascript - 在容器中制作多个 <span> 自动换行

Question

我的问题如下所示:jsfiddle demo

如您所见，<span>如果我把每个 <span> 元素会自动换行在 html 的新行上文件。

但是，如果我将它们一个接一个地放在一起，它们就不会断线。

请注意，为什么我问这个问题是因为在我的真实元素中，我添加了 <span>来 self 的 js动态编码。这将导致同样的问题，即 <span>不能自动换行，当数量增加时会添加一个水平滚动条。

任何建议将不胜感激。

附注我在我的代码中使用了 Jquery 和 Bootstrap 3。

Answer 1

你可以让你的 span 标签像 inline-block 元素一样。它们将显示 inline 但如果它们不适合容器，它们将转到下一行。

span{
   display: inline-block !important;
}

Updated JSFiddle .