CSS ipad / iphone 上固定页眉、页脚和侧边栏的问题
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15254095/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Issues with fixed header, footer and side bar on ipad / iphone
提问by user1680857
I'm in the process of developing a new website for a local club.
我正在为当地俱乐部开发一个新网站。
I've created the main webpage and have a fixed header, footer and side bar, the content is in a scrolling element. The page looks perfect on my MacBook and in various browsers. When I look at the page on my iPhone or iPad the page looks as it should until I zoom the page and then the fixed side bar is no longer fixed.
我已经创建了主网页并有一个固定的页眉、页脚和侧边栏,内容在一个滚动元素中。该页面在我的 MacBook 和各种浏览器中看起来都很完美。当我在 iPhone 或 iPad 上查看页面时,页面看起来应该是这样,直到我缩放页面,然后固定的侧边栏不再固定。
If anyone has any clues as to what I'm doing wrong I'd be very grateful as this is driving me mad.
如果有人对我做错了什么有任何线索,我将不胜感激,因为这让我发疯。
The test page can be viewed at http://tawvelo.org/new/home.html.
可以在http://tawvelo.org/new/home.html上查看测试页面。
I've attached a couple of photos which will hopefully show the issue.
我附上了几张照片,希望能说明这个问题。
回答by Terry
position: fixed
is known not to play well on iOS - http://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios/
position: fixed
众所周知,在 iOS 上玩得不好 - http://remysharp.com/2012/05/24/issues-with-position-fixed-scrolling-on-ios/
How to fix it? Easy. Search StackOverflow. This question has been asked previously:
如何解决?简单。搜索 StackOverflow。这个问题以前有人问过: