Reputation: 11
I've created a Cordova/Phonegap website and every works fine, except on a iPhone X with IOS 11. The problem is that the footer is position fixed at the bottom but it doesn't stay there the whole time. If I scroll down on the app the footer stands still for a second and then gets to the bottom. The problem only appears on that phone, not on a Android or Windows.
.footer-result
background-color: $color-4
bottom: 0px
clear: both
color: $color-1
display: block
font-family: "ff-kava-web-pro", sans-serif
font-size: 1.3em
left: 0
right: 0
padding: 10px 20px
position: fixed !important
width: 100%
z-index: 9
transform: translateZ(0)
Upvotes: 1
Views: 2430
Reputation: 3109
Okay - lots of CSS files in there - so hard to quickly debug, but I think if you move your fixed footer element to be a simple child of "body" or maybe div class "views" then the element should truly fix to the bottom. I have seen fixed elements in iOS jump about or position incorrectly when their parent divs have absolute or relative positions. Also you might want to look at this page: https://stanko.github.io/ios-safari-scoll-position-fixed/
Good Luck!
Upvotes: 2