0

我希望 html 标记中的这个图像只填充 320px 的最大宽度,就像它应该的那样。然而,它还不止于此。水平滚动条出现,图像平铺增加了 166 个像素。在 IOS 模拟器和我的 ipone 中,所有其他元素都正确跨越了宽度。

@media only screen and (max-width : 320px) {
html {
margin:0; 
padding:0;
background: url('../_images/iphoneCardboard_flat.png')repeat;
}

更新:这些是一些可能相关的标签。

#band1 {
position: absolute;
top:0;
left:0;
height:50px;
width:100%;
background-image: url('../_images/iphoneGradient.png');
z-index:-1;
}

.barbLogo {
position: absolute;
top:3px;
margin-left:165px; 
width:320px;
}

#band2{
position: absolute;
top:-75px;
left:0;
height:50px;
width:100%;
background-image: url('../_images/iphoneGradient.png');
z-index:-1;
}

#gridBgContainer{
position: absolute;
margin:0;
top:50px;
left:0;
height:200px;
background:url('../_images/gridBg.png');
background-repeat: repeat;
display: table;
z-index: 1;
}

#wrapper {
position: relative;
top:0px;
left:0;
right:0;
margin: 0 auto 0 auto;
width:100%;
text-align: center;
z-index: 3;
}

#socialLinks {
position: absolute;
margin-top: 14px; 
float:right;
right:0px;
}

#top-menu {
position: absolute;
top:0px;
left: 0px;
width:320px;
z-index: 100; 
}

section#homeContent {
position: absolute;
top: 400px;
width:320px;
z-index: 10;
}

section#faqContent {
position: absolute;
top:900px;
width:320px;
z-index: 10;
text-align:left;
}

footer {
position: absolute;
font-size: 1.15em;
top: 1230px;
padding: 0 1% 0 1%;
width: 100%;
height: 75px;
text-align: center;
z-index: 10;
}

.footer{
text-align:center;
padding: 2% 0 0 0;
}

#band3{
position: absolute;
top: 1255px;
left:0;
height:50px;
width:100%;
background-image: url('../_images/iphoneGradient.png')repeat-x;
z-index: -1;
}
4

1 回答 1

0

你应该设置宽度属性

@media only screen and (max-width : 320px) {
html {
margin:0; 
padding:0;
background: url('../_images/iphoneCardboard_flat.png')repeat;

width: 320px;

}
于 2012-10-15T23:54:38.730 回答