Streaming live at 10am (PST)

Safari VH and FLEX issues


#1

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


#2

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!


#3

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

Also, you see I have issue with footer too.


#4

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


#5

hi @Alexey_Kargapolov

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


#6

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:


#7

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.


#8

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