The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Mysterious header gap on iOS 7

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
  • #164460

    Hi, everyone.

    I’m a newbie, so please bear with me.

    This is my work, based on, with masonry js: – It’s not finished, but looks more or less as supposed to in all major desktop browsers, as well as Chrome and Firefox on Android. However, when opened in an iPhone or iPad, whether Safari or Firefox, there appears an enormous empty gap between the header (logo and title) and content sections.

    The gap does not appear in any simulations – here, everything looks fine:

    I’ve tried redefining all padding and margins, what float and what doesn’t, in the header, I’ve tried replacing the .svg image with a .png, I’ve basically rooted up the whole header and rewritten it, etc – and the mysterious gap remains. Any help would be immensely welcome.

    Here’s the stylesheet:

    All the best,


Viewing 1 post (of 1 total)
  • The forum ‘CSS’ is closed to new topics and replies.