Gmail home page css

Question

我更像是一名程序员，而不是一名网页设计师，我正在尝试做一个简单的（我认为）设计，比如gmail的主页https://mail.google.com/intl/fr/mail/help/about.html

我在屏幕中央有一个带有overflow:hidden的div，这样背景图像就不会调整大小。

在这个div中，我有另外两个div，一个在左边，一个位于右边，问题是，因为当我收缩页面时，主div是overflow:hidden，所以右边的div不再可见。

您可以在此处看到演示：http://jsfiddle.net/e7MMQ/

Answer 1

首先，后台与div溢出无关，您可以使用

background-attachment:fixed;

和你的divs

只需使用float : left;和float : right ;

如果这就是你想要做的：

http://jsfiddle.net/prollygeek/e7MMQ/1/

这是因为你已经指定了一个宽度，你的div仍然在那里，但你必须向右滚动才能看到它。

Answer 2

您可以尝试在左/右div中应用溢出：隐藏并修复它们。这是假设您在较大的容器中没有任何内容，并且所有内容都在左/右分区中。

然后将较大的容器设置为固定大小，即左/右div的组合大小。

HTML:

<div id="container">
<div id="left">Some content</div>
<div id="right">Some other content</div>
</div>

CSS：

#container{
width:300px;
height:300px;
}
#left{
float:left;
width:150px;
height:300px;
overflow:hidden;
}
#right{
float:right;
width:150px;
height:300px;
overflow:hidden;
}

希望能有所帮助！