Chr*_*vat 4 css background-image width ipad
在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>
Run Code Online (Sandbox Code Playgroud)
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;
}
Run Code Online (Sandbox Code Playgroud)
有一个明显的解决方案,我错过了吗?
小智 7
我尝试使用上面的建议,即身体标签中的min-width:1024px,但它不起作用.经过大量搜索,我发现将它添加到html标签也有效.
例:
html {
min-width: 1024px;
}
Run Code Online (Sandbox Code Playgroud)