CSS span不完全换行

Question

我在处理内容时遇到了一些问题，当达到最大宽度时需要将内容换行。我的博客设置为在单个div中显示所有标签，当第一行达到最大宽度时，下一个标签应该跳到下一行。（附上在Chrome和Firefox中出现的情况）

http://jsfiddle.net/QHWNF/7/

这里是CSS代码：

p.tagHolder{
margin-bottom:5px;
line-height:25px;}

所有的HTML/PHP代码如下：

<a href="#"><span>TagName</span></a><a href="#"><span>TagName2</span></a>....

- Cow

---

也许你可以创建一个最小的 fiddle（jsfiddle.net），展示问题。在那里，你甚至可以包含你的图片。 - Stephen P

Answer 1

尝试将您的span元素设置为"display: inline-block"。 http://jsfiddle.net/QHWNF/10/

- Nate

---

@Krewe - 太好了，这个方法可行，这正是我所想的。不过，我会将<a>放在<span>标签中，而不是反过来，这样就会得到<span class="tag"><a href="#">Test</a></span>。我的意思是：这是一个标签，它链接到（某个东西）。 - Stephen P

我在<span>标签周围放置<a>标签的原因是我希望用户能够悬停在文本上单击并单击整个灰色框。这是唯一的原因。 - Cow

Answer 2

请在您的和

容器中添加word-wrap: normal;和word-break: normal;。这将确保仅在允许换行点处断开单词。

希望这有所帮助！

- Chris