iPad上的背景图片宽度不是100％ [英] Background image width not 100% on iPad

问题描述

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

My background images have not been spanning the full width of the browser when viewed on an iPad. This has happened more than once now, so it must be in the way I'm writing the CSS.

这是一个bg图像停止的页脚示例在iPad上70％的方式 - 它有三列浮动。

Here is an example of a footer whose bg image is stopping about 70% of the way on iPad- it has three columns floating within.

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

I've put the full project up here: 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;
}

我有没有明显的修复方法？

Is there an obvious fix that I'm missing?

推荐答案

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

I tried using the suggestion above i.e. min-width:1024px in the body tag but it did not work. After a lot of searching I discovered adding it to the html tag also works.

示例：

html {
    min-width: 1024px;
    }

这篇关于iPad上的背景图片宽度不是100％的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！