移动网站的CSS问题

Question

我正在构建this移动网站。

如果您在移动浏览器上查看它，它应该适合没有水平滚动。 （内容应仅垂直堆叠）。 有人可以帮我修复页面的CSS。只是让我知道正确的CSS应该是什么，以便自动调整不同的手机。

可以找到此页面的CSS here。基本上，我猜两个主要组成部分。 （正文和内容）。

另外，我使用this移动网站作为示例。请通过查看该页面的来源来参考其内联CSS。

由于

Answer 1

好的，所以看起来你的#content div实际上是在我的大型firefox浏览器上推动屏幕边界。在你的CSS中，你可以这样声明：

#content{
    width:100%;
    margin: 0;
    padding: 20px;
    background: white;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}

我已经通过在本地编辑CSS来确认，你的填充实际上正在推动100％宽度div的边界，但好消息是，因为它是块级元素，所以它已经填满了它所有可用的空间。试着摆脱“宽度：100％;”并看看这是否适合你。它仍将显示完全相同，但没有那些滚动条。

这样的事情：

#content{
    padding: 20px;
    background: white;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}