css - 是否可以为用户输入设置两列布局的样式(因此它会溢出到第二列)

Question

我正在创建一个网站，稍后将由用户通过 CMS (Joomla!) 进行编辑。

我想知道是否有一种方法可以对其进行样式设置 (css)，以便当用户键入文本时，它会在达到设定高度时自动将其排入第二列。

所以双列布局...只有文本...当文本达到 300 像素的高度时，我希望它进入顶部右侧的第二列。

我很好奇是否有一种方法可以仅使用 css 来实现这一点，它肯定会为我节省一些 javascripting 的时间。

再次感谢Stack的 friend 们!

Answer 1

查看 CSS3 column-count property .有一个polyfill让它在旧浏览器中工作。

textarea {
   -webkit-column-count: 3; /* Safari & Chrome */
      -moz-column-count: 3; /* Firefox */
       -ms-column-count: 3; /* Internet Explorer */
        -o-column-count: 3; /* Opera */
           column-count: 3; /* W3C */
    height: 300px;
}

演示:http://jsfiddle.net/nPxSL/1/