css - 位置绝对 iPad 容器宽度问题

Question

我在 iPad Safari 中查看时遇到问题，我的容器 div 正在调整大小以适应绝对定位的元素。iPad 似乎将溢出元素的宽度添加到“.content” 980 宽度并缩小以显示大约 1080 像素的宽度。也许有一个属性可以强制 iPad 只调整到 980px 宽度的内容？

我有一个包含内容类的容器 div，其中定义了以下 css 属性：

.content{
    position:relative;
    width:980px;
    height:100%;
    margin:0 auto;
}
.e1{left:880px;top:892px;width:300px}

在内容中，我有一个超出 980px 宽度范围的绝对定位元素，如下所示：

<div class="content">   
   <div class="e1">
      <img src="images/elements/e1.png"/>
   </div>
</div>

iPad Safari 截图

score 5 · Accepted Answer

我有一个类似的问题，并能够使用下面的代码修复它，希望这有助于...

html,body
{
width: 100%;
overflow-x: hidden;
}

score 4 · Accepted Answer

将此添加到您的脑海中：

<meta name="viewport" content="width=980, user-scalable=0" />

编辑：

好的，查看您的代码和屏幕后，我可以看到元素实际上并不是绝对定位，因为您已经设置了顶部和左侧，但没有包含“位置：绝对；”。任何人，似乎问题在于图像的宽度，所以将其添加到您的 css

.e1 img{
    width:100%;
    height:auto;
}

2 回答 2