Question

有没有办法让2个Div元素并排，让我们说两个宽度：200px，高度：200px和float：left，在不使用PHP的情况下在div之间有某种“自动”分页符（计算单词ie）？

我问的原因是我有一个很长的动态文本。而且我想将它延伸到2个div，优先于css。

麦克

Answer 1

如果你希望文本在两个div之间（我认为你想要的那样？），那么你可以使用CSS列

div#columns {
    column-count:2;
    column-gap:20px;
    -moz-column-count:2;
    -moz-column-gap:20px;
    -webkit-column-count:2;
    -webkit-column-gap:20px;
}

示例：http://jsfiddle.net/jasongennaro/74ZrZ/

更多信息：https://developer.mozilla.org/en/CSS3_Columns

Answer 2

据我所知，您希望将长篇文章放在专栏中？对同一文本源使用两个div并不那么容易，并且肯定需要JavaScript（或者jQuery是精确的。）

但是，您可能正在寻找的方法是CSS based columns。

.two_columns {
    -moz-column-count: 2;
    -moz-column-gap: 10px;
    -webkit-column-count: 2;
    -webkit-column-gap: 10px;
    column-count: 2;
    column-gap: 10px;
}

Answer 3

当div中的文本溢出时，使用CSS可以允许滚动条出现（例如，如果你想要一个垂直滚动条，可以使用overflow-y: auto），但你不能指定另一个元素来“转移”补充文本。

这可以通过JavaScript来完成，通过测试div的内容是否在向其添加文本后溢出，然后将一些文本移动到另一个div。但我宁愿让用户滚动。

2 div元素具有自动文本中断功能

3 个答案: