Today (15 Jan) I’ve started seeing alignment issues which I have never experienced before. (I’ve built 40+ webflow projects). This appears to happen on the narrow viewport.
I’m having to wrap elements inside Divs to prevent this. See image below.
It’s caused by the Sample Menu button having a setting of display: inline block so it will try to sit inline with what’s around it when it can. It’s only on some screen sizes which is why it’s likely not been spotted before.
One way around this is to change the buttons display setting, or even better would be to give the text box class that your content sits in a setting of display: flexboxvertical
Grid and flexbox are great when used together so definitely no need for one or the other.
I had to rebuild this project as clients Apple products made the website look dreadful. Client was complaining about issues I did not recognise or see. Client sent screenshots from MacBook and iPhone and I could see all problems related to Grid.
Once rebuild using divs the client was happy.
So, question is "should we abandon use of Grid layouts? Because this site was completely screwed on Safari