The root problem here seems that iOS8 safari won't hide the address bar when scrolling down if the content is equal or less than the viewport.
As you found out already, adding some padding at the bottom gets around this issue:
html {
/* enough space to scroll up to get fullscreen on iOS8 */
padding-bottom: 80px;
}
// sort of emulate safari's "bounce back to top" scroll
window.addEventListener('scroll', function(ev) {
// avoids scrolling when the focused element is e.g. an input
if (
!document.activeElement
|| document.activeElement === document.body
) {
document.body.scrollIntoViewIfNeeded(true);
}
});
The above css should be conditionally applied, for example with UA sniffing adding a gt-ios8 class to <html>.