Streaming live at 10am (PST)

Flexbox rendering issue on Safari iOS9

Hey guys,

There is a grid layout on my website that looks weird in iPhone safari browser. I have attached the screenshots.

Here is the link to the website -

Can you please help me fix this?

@rkoomera Could you please update your post with some more information so we can help you faster? Such as sharing your Read-Only link.

How to share a read-only link:

Thanks in advance! :slight_smile:

Sure. Here you go.

Hi @rkoomera, thanks for the read-only link, I think there is a flexbox rendering issue there in iOS with the way the styling is set currently, however a few changes should help. I would use some columns for the features content and remove some of the flex styling.

Take a peek at a quick video:

I hope this helps!


just wondering … what dev tool software is that you use for emulating that mobile site ? :slight_smile:

Hi @Daniel_Schultheiss, I use, although it is not perfect for the latest bleeding edge cases (sometimes), it is pretty much dead on most of the time :slight_smile:

One thing is nice about Browserstack, you can get the real Phone view, and open the css inspector at the same time on mobile, to quickly identify the issues.

1 Like

Awesome man! It worked!! Thank you so much for your help.

1 Like

so, i understand that flex layout caused the issue in iOS browser. Is there a way I could still get the boxes to have same height and width?

This topic was automatically closed after 60 days. New replies are no longer allowed.