从位于<p>的<span>中换行文本

Question

以下是代码：

<div class="container">
  <div class="col-md-12 col-sm-3">
   <p style="font-size:12pt;color:#535679;line-height:0%;">Some really cool text, <span style="font-size:12pt;color:#535679;line-height:0%;">and even more cool text</span>.</p>
  </div>
</div>

在这个例子中，在小屏幕上＆＃34;甚至更酷的文字＆＃34;包裹在同一行，导致一些非常酷的文本＆＃34;和＃34;甚至更酷的文字＆＃34;重叠。

添加＆＃34;自动换行＆＃34;或＆＃34;白色空间＆＃34;在这个实现中，似乎没有帮助。我做错了什么？

Answer 1

从div和span JS Fiddle

中移除line-height: 0%

零line-height基本上表示文字高0px，因此当它换行时，它会换行到同一行。