Html 将单词换行并重复到新行中

我在span中使用ng repeat很有价值。我在新行中得到了单词like

实际产量：

我用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;

我希望输出像：

---

而不是在

span

上使用

wrap

。我建议您在父div中使用

display:inline block

---

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

只需按如下所示创建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>

---

显示值是多少？如果怀疑如果其
内联块
，分词是否有效。通常情况下，适合整个屏幕的block元素会出现分词，并且会有大量的单词组成许多语句。请尝试将
word wrap
属性更改为
nowrap
@Vijay我使用的是display:block，但如果我使用内联block，它可以工作，但我必须在CSS中进行更多更改，它将反映其他UI。除了内联块，还有其他解决方案吗？
#mainDiv{
 width: 200px; // any pixel you want to set;
}
.tag{
display:inline-block;
}