水平滚动网站内容

Question

我的目标是为我的投资组合建立一个网站。 我有一个div的菜单，希望在另一个div的顶部，作为我所有图像的容器。图像必须填充浏览器的100％高度。 问题是，我希望我的网站水平滚动，当我开始添加内容时，一旦宽度超过浏览器窗口的100％，新图像就会在第一个图像下方使其水平滚动。

我该怎么做才能纠正这个问题？

CSS

body, html {
    height: 100%;
}

#main {
    width: 100%;
    height: 100%;
    background-color: #000;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}

#menu {
    width: 200px;
    height: 500px;
    background-color: #fff;
    position: absolute;
    top: 10px;
    left: 10px;
    overflow: scroll;
    z-index: 2;
}

#img {
    height: 100%;
    float: left;
    overflow: scroll;
}

Answer 1

从#main标记中删除宽度。一旦元素达到100％，它就会向下移动到下一行。