Streaming live at 10am (PST)

Flexbox prefixes are not supported in older versions of Safari


#1

Hello Webflow Community!

I originally posted this post to the Design Help category, but I feel it is appropriate to move it over to Code Help now as it's almost solved!

The current issue I'm running into is on the amazing Flexbox addition to Webflow, and how it unfortunately loses functionality on older versions of Safari.

@PixelGeek was helpful and posted this link that shows that Flexbox is not fully supported by Safari versions 8 and older, unless it has a prefix: -webkit-

Now my question is: where can I put that prefix so I can make Flexbox work on these older versions of Safari?

Here is a screenshot of where it mentions the prefix to support for older versions:

And the public share link: https://preview.webflow.com/preview/bold-la?preview=3e6eeeb912dbee393402befac61ec82a

Thank you all!!


#2

Hi @eellee - we're investigating how to make this automatic for ya! Will try to send an update in the next few days.


#3

@callmevlad! Thank you so much for your response!

I really appreciate it. I totally understand that it's an odd request, but duty calls.. When an entire office in Germany uses an older version of Safari and sees something wrong, it seems more scary than it really is!

I will keep checking back for updates.

Thank you again.

P.S. This was another helpful link I found that discusses the mixing of browser compatibility:
https://css-tricks.com/using-flexbox/


#4

@eellee We just pushed a fix to enable prefixing for Safari 6+ and iOS 7+. Can you try to republish your site and see if your flex issues are fixed in those older browsers? Thanks!


#5

Is this browser prefixing automatic now in webflow? Does webflow include older flexbox syntax for previous versions of IE?


#6