Flex items stacking incorrectly on Safari

https://preview.webflow.com/preview/firstcitizen?preview=9e61ff45a43ddea1b50bacf9084b4e59
Hi there, about to make a site go live and notice that the 4 coloured category boxes at the bottom of the home page (which are flex items) are not stacking correctly on Safari.
Works okay on Chrome/Firefox. Any idea what’s going on here?

Safari puts extra space after the last flex item. Don’t ask why. Safari is the new IE.

You can fix it by making any one of the “column” elements 24% width instead of 25%.

Edit: That’s a gorgeous site, BTW.

Thank you very much for the fix & feedback! :slight_smile:
What a bizarre thing for Safari to do?!

1 Like

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