Safari VH and FLEX issues

Is there any quick solution for issues with FLEX and VH in Safari?
One of the elements I’m having trouble with is tiles-style menu.
I don’t have time to rebuild it and now it becomes a real headache.

Here is my public share link: https://preview.webflow.com/preview/ana-marina-nha-trang?preview=91fd85b4eb2096c7e7a2f61ed76c06db

Hi @Alexey_Kargapolov, thanks, it looks like Safari is not rendering the flexbasis perhaps on the tiles-column classes, I would add a height of 100% to the Body (all pages) class and then a 100% height on the tiles-column class, then republish.

Let me know if that helps!

Dear Dave,
thanks for the tip, but no effect. What else I can try?

Also, you see I have issue with footer too.

Hi @Alexey_Kargapolov, I see that the styles were applied, and now it looks like this for me in Safari:

hi @Alexey_Kargapolov

Works for me, too. If your error persists, what Safari version are you on?

Hi, Dave!
Big thanks for the assistance.

Actually your trick did not work for me.
I finally had to refuse VH parameters at all, also the same for flex “wrapping”:
had to put tiles in two horizontal and give the blocks size in pixels.
Which is quite sad, but I can’t say to my client “Don’t open it in Safari” :slight_smile:

Safari has some flexbox bugs where content collapses. Not Webflow but a Safari issue. Its a shame as flexbox really makes it easy to design and create complex layout vs the old float method.

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