Search code examples
jquerycsspositionfixed

iOS7 position:fixed; works ugly

I know iScroll and I already used jQuery mobile for a long time and I know both of them fixed this problem but I want to do it myself and not include a large framework for this. My question is how did jQuery Mobile fixed this position:fixed; problem on iOS devies? Currently all my fixed positioned elements will only change the position if the scroll is finished, but it should always appear fixed at the top and not only at the end of the scroll.

Solution

  • I had the same problem. I had a fixed element over the body and this was very buggy. And for me height:auto; instead of height:100% worked. Full code:

    body,
html{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:auto; /* iOS position:fixed; elements fix (not 100%) */
    min-height:100%;
    overflow-x:hidden;
}