如何在HTML列中保留段落？

Question

所以,我有一个看起来像......的页面

I am a monkey
I am a monkey too, with
additional information.
I am also a monkey

如果我使用-webkit-columns:2标签将其包装在CSS中,则显示为...

I am a monkey               additional information
I am a monkey too, with     I am also a monkey

我希望它能避免在这种情况下拆分段落.

我正在寻找类似"nobr"或自动换行功能的东西...... eeek.有任何想法吗？

(稍后......)似乎我可以在Firefox中执行此操作,但不能使用Chrome.嗯...

Answer 1

试试这个:

-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid-column;

第一个应该处理Chrome/Safari; 第二个Firefox.第三是符合标准的 "正确"方式.

H/t /sf/answers/544999801/

Answer 2

你可以设定

p {
  display:inline-block;
}

这将防止该段落在列中断处中断。可能还有其他一些奇怪的效果，因此请先进行良好的操作。

Answer 3

使用带有不可见边框的表格怎么样？也许这可以解决问题。