跨度词包裹在ng重复到新的行

Question

我在span中使用ng repeat有价值。我在新行中得到了像

这样的词

实际输出：

我喜欢使用CSS

    border: 1px solid #ECE9E6;
    border-radius: 3px;
    text-align: center;
    font-size: 12px;
    padding: 5px 15px;
    position: relative;
    line-height: 33px;
    margin-right: 3px;
    word-wrap: break-word;

我希望输出如下：

Answer 1

而不是使用word-wrap而不是span。我建议你在父div中使用display:inline-block。

这将确保您的完整内部div移动到下一行。

Answer 2

只需将您的HTML设为如下

即可

<div id='mainDiv'>
<span class='tag'>abc</span>
<span class='tag'>lmn</span>
<span class='tag'>xyz</span>
<span class='tag'>etc</span>
<span class='tag'>etc</span>
</div>

按以下方式添加css。

#mainDiv{
 width: 200px; // any pixel you want to set;
}
.tag{
display:inline-block;
}