Extra space between vertically stacked components in mobile Safari

  • 1
  • Problem
  • Updated 2 years ago
So I use desktop pages even on my iPhone. I just like it better. Call me weird... call me a criminal... I just like it better to have the full desktop functionality instead of a mobile page. Desktop pages render well in Safari except that there is an extra.... say 20px to 50px of space between vertically stacked components. So if I have a wrapper component and underneath it I have a responsive grid component, there is much more space between the two when viewed in mobile Safari than in desktop Chrome. Anyone know of any way I could address this?
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb

Posted 2 years ago

  • 1
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Raymond,

I'm having trouble reproducing this issue (on my test page it didn't add any extra space).
  • What version of Skuid are you on?
  • What iPhone are you using?
  • Do you have any CSS on your page that could be causing that extra space?
  • Does this happen even on a simple page that has just a few components?
Thanks!
Amy
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Thanks for the reply, Amy...
- Skuid 8.15.8
-iPhone 6 with latest software
- I do have some CSS, but nothing that should effect padding or borders or gaps or margins in that way. It only happens on vertical "row" spacing not horizontal "column" spacing. It even impacts responsive grids that wrap to the next row.
- seems to be all my pages. It is just more noticeable with recent layouts I'm building that are more sensitive to the vertical space issue.
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Hmm. Are you using a standard theme or a custom theme? Do you need to update your themes?
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Hmmm... custom theme. I did have some CSS in the theme that I did not need any more so I deleted it, but it did not fix the issue.. I updated themes recently and they do not need updating currently. I wrap most components in wrappers. Did you try vertically stacked wrapper components in a responsive grid? That may be a common theme as I typically put all components in wrappers in responsive grids.