div中的背景颜色在iphone中不起作用

时间:2012-10-05 11:49:01

标签: wordpress css3 responsive-design media-queries

我为网站http://www.domda.se做了一些媒体查询 问题是当我在iphone上查看网站时,#middle和#bottom中的backgroundcolours不起作用。当我添加-1个边距以防止div之间出现间隙时,问题就出现了。我试图删除负边距,看看是否有帮助,但它没有用。

我做错了什么?

1 个答案:

答案 0 :(得分:1)

在此规则中,进入此媒体查询

@media only screen and (max-width: 480px), screen and (max-device-width: 480px),
screen and (max-width: 600px)  {
/* ...some other stuff here... */
    #middle {
        background: #00ffff;
        float: none;
        margin: -1px 0 0 0;
        width: 100%;
        clear: both;
    }
/* ...some more stuff here... */

您可以尝试添加overflow:hidden;吗?同样在#bottom

#bottom {
    background: #fff;
    float: none;
    margin: -1px 0 0 0;
    width: 100%;
    clear: both;
    overflow:hidden; /* ADD THIS PROPERTY ON BOTH */
}

我认为问题是您要删除float,因此容器不再包含其内容。