css - 您能否使网页从左到右滚动而不是从上到下滚动？

有没有一种方法可以使网页分为几列，这些列从左到右滚动而不是从上到下滚动？这样你就

x x x x x
x ... ..x ... ... ... ...
x ... ..x ... ... ... ...
x ... ..x ... ... ... ...
x ... ..x ... ... ... ...
x x x x x

代替

x x x x x
x ... ..x
x ... ..x
x ... ..x
x ... ..x
x x x x x
  ... ...
  ... ...
  ... ...
  ... ...
  ... ...
  ... ...

如果那是有道理的...换句话说，我希望文本在浏览器窗口的底部停止，然后在新列中继续进行，并使此过程“无限地”发生，直到没有更多内容为止。

在下面添加了一个屏幕截图，以更好地进行说明。您会看到文本在底部屏幕下方显示。我希望屏幕下方的内容显示在第一节旁边的顶部。我想做的是将一首完整的歌曲放在一个屏幕上（他们通常会这样做，尤其是在宽屏显示器上），而不必做很多脆弱的数学运算以及标记的计算或更改。当前都在pre标记中，但是我想只要和弦可以与它们所在的词匹配（等宽字体等）就可以切换。我基本上是在寻找一些魔术CSS，即使它存在:)

最佳答案

这听起来像是CSS列的工作：

http://jsfiddle.net/Lkzqt/

html, body, .container {
    height: 100%;
}

.container {
    columns: 10em; /* desired width of your column */
}

<div class="container">
    <p>...</p>
    <p>...</p>
</div>