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，如果它存在的话：）

---

是的，只要将div并排排列，页面底部就会出现一个水平滚动条

HTML:

---

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

html，主体，.container{
身高：100%；
}
.集装箱{
列：10em；/*所需的列宽度*/
}

您可以。。。但是你应该吗？用户通常不喜欢这样的网站。我不确定其他人的情况，但我的鼠标滚轮不适用于水平滚动网站，除非我直接指向滚动条。一般来说，绝大多数情况下绝对不行！但这是一个特殊的情况，我试图在一个屏幕上尽可能多地适应。我试图避免一起滚动：）是的，但这里有3个单独的div。我的意思是，如果你用段落来改变你的内部div，在其中添加更多的文本和更多的段落。我希望文本像正常一样向下流动，直到到达底部，然后环绕到顶部，继续它停止的位置。我不能先把它分成几列，因为那会很难。不知道浏览器窗口有多大，字体大小和线条高度等等，都会很痛苦：）那么你想要段落，不管段落从页面右侧延伸多长时间？我希望段落一个接一个地向下延伸，直到它们到达窗口底部，然后继续在顶部，例如，再向右20%。如果它在段落的中间，文本也应该在顶部继续，因此文本被分解。整个段落不应该跳到最上面。如果可以避免的话。添加了一个屏幕截图，希望能更清楚地表明我的意图：）这就是我所希望的。我只是还没有完全掌握如何使用它们，所以我问。我想我现在真的成功了！非常感谢：）为什么还要在

html

和

body

上设置

height:100%

？没有它似乎不起作用，但我不太确定我是否理解高度设置的作用……默认情况下，容器类型元素（如html和body）的高度将与包含其子元素所需的高度相同。如果您只是在

.container

元素中指定它，您的意思是“和我的父母一样高”。对于html和body元素，父元素是视口，因此

height:100%

表示“与视口一样高”。这是有道理的，尽管出于某种原因，它现在似乎可以在不设置body和html的高度的情况下工作。不知道为什么。。。我只将容器的

columns

属性设置为600px。

<div id="wrapper">
    <div>Col 1</div>
    <div>Col 2</div>
    <div>Col 3</div>
</div>

#wrapper{
    overflow-x:scroll;
}
#wrapper div {
    display:table-cell;
    border:1px solid #000;
    min-width:400px;
}

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

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

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