[英]span word wrap in ng repeat into new line
I have values in using ng repeat in span.I got word like in new line like 我在跨度中使用ng repeat具有价值。我得到像新行这样的单词
Actual output: 实际输出:
I used CSS 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;
I want output like: 我想要像这样的输出:
Instead of using word-wrap
over span
. 而不是在
span
上使用word-wrap
。 I'll suggest you to use display:inline-block
in the parent div. 我建议您在父div中使用
display:inline-block
。
This will make sure your complete inner div will move to next line. 这将确保您完整的内部div移至下一行。
Just make your HTML as below 只需如下所示制作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>
Add css as below. 如下所示添加css。
#mainDiv{
width: 200px; // any pixel you want to set;
}
.tag{
display:inline-block;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.