2 divs 100%彼此相邻

Luu*_*uuk 10 html css css-float

相当简单的问题,但尝试了一切.

我想要的是2(实际上是5)div与彼此旁边的类"容器"所以我可以做一个水平1页的网站.每个div必须是100%宽.所以2个div意味着彼此相邻的2个屏幕.

这是我现在的css线:

.container { width: 100%; float: left; display: inline; }
Run Code Online (Sandbox Code Playgroud)

我不能让他们排成一列.

这是一个让它更清晰的视觉效果. 在此输入图像描述 image url进行更大预览:http://www.luukratief.com/stackoverflow.png

滚动部分对我来说不是问题,只是div的位置.

这可能是使用百分比还是这是不可能的.如果是这样,请告诉我如何用css做到这一点.

提前致谢!

Joh*_*son 11

您可以制作宽度为200%的容器,然后在该元素内放置两个div,宽度为50%,这样您就可以确保一个div总是获得整个访问者的屏幕宽度.

例如:

<div class="container">
    <div class="contentContainer"></div>
    <div class="contentContainer"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

和CSS:

.container {
    width: 200%;
}

.contentContainer {
    width: 50%;
    float: left;
}
Run Code Online (Sandbox Code Playgroud)