iPad上的背景图片宽度不是100%

时间:2011-12-05 15:58:10

标签: css ipad width background-image

在iPad上查看时,我的背景图像未覆盖浏览器的整个宽度。这已经发生了不止一次,所以它一定是我写CSS的方式。

以下是一个页脚示例,其bg图像在iPad上停止了大约70% - 它有三列浮动。

我把完整的项目放在这里: https://github.com/christineh/TJ-portfolio

HTML:

<footer>
<div class="footer_invs">
<div class="footer">
<h1></h1>
<p></p>
</div>
<div class="footer">
<h1></h1>
<img src="" width="32" height="32" border="0">
</div>
<div class="footer3">
<h1></h1>
<img src="">
</div>
</div>
</footer>

CSS:

footer {
    background: url(images/footer/background.jpg) repeat-x;
    width: 100%;
    height: 113px;
    margin-top: 250px;
    overflow:hidden; 
    overflow-x:hidden; 
}
.footer_invs {
    background: url(images/footer/corner.png) no-repeat 186px 0px;
    width: 1018px;
    height: 78px;
    padding-left: 200px;
    padding-top: 32px;
}
.footer {
    float: left;
    width: 275px;
}
.footer h1 {
    padding-bottom: 8px;
}
.footer p {
    color: #FFF;
    padding-bottom: 0px;
    line-height: 16px;
    padding-top: 0px;
}
.footer img {
    padding-right: 10px;
}
.footer3 {
    float: left;
    width: 120px;
    padding-left: 70px;
}
.footer3 h1 {
    padding-bottom: 8px;
}

我有一个明显的解决方法吗?

2 个答案:

答案 0 :(得分:7)

我尝试使用上面的建议,即身体标签中的min-width:1024px,但它不起作用。经过大量搜索后,我发现将其添加到html标签中也有效。

示例:

html {
    min-width: 1024px;
    }

答案 1 :(得分:3)

非常确定iPad的屏幕宽度是1024px。这是设置在哪里吗?

body{
 min-width:1024px;
}

注意:我没有让我去测试。