2

我不确定我能清楚地解释问题是什么，所以请理解。

我有这个 HTML 代码：

<div id="container">
    <div id="navbar">
        ...
    </div>
    <div id="content">
        ...
    </div>
</div>

这是CSS代码：

#container {
    display: block;
    width: 640px;
    height: 480px;
}
#navbar {
    display: block;
    position: fixed;
    width: 640px;
    height: 70px;
}
#content {
    display: block;
    marign: 70px 0 0 0;
    width: 640px;
    height: 410px;
    overflow-y: auto;
}

它在桌面和任何基于 Android 的浏览器上运行良好，但在 iPhone 的 Safari 中......当我放大此页面时，内容运行良好，但固定元素保持在相对于屏幕的位置上。其他所有元素都运行良好。

问题是什么？我不知道...

4

3 回答 3

-1

试试这个代码http://jsfiddle.net/nandhakumarsri9/bkwLG/

#container {
    display: block;
    width: 640px;
    height: 480px;
    border: 1px solid #000;
    box-sizing: border-box;
    position: relative;
}
#navbar {
    display: block;
    position: absolute;
    width: 640px;
    height: 70px;
    border: 1px solid #F00;
    box-sizing: border-box;
}
#content {
    display: block;
    width: 640px;
    height: 410px;
    overflow-y: auto;
    border: 1px solid #00F;
    box-sizing: border-box;
    position: absolute;
    top: 70px;
}
于 2013-02-13T10:54:57.093 回答
-1

大多数移动浏览器都存在固定定位问题。尝试使用带有 data-position="fixed" 属性的 jQuery 移动框架。

于 2013-04-25T10:35:37.843 回答
-1

具有固定位置的元素相对于浏览器窗口定位。

你应该给top: 0;和/或left:0等

于 2013-02-13T10:14:30.287 回答