Streaming live at 10am (PST)

Mobile Preview & Mobile browser being displayed differently


#1

Hi.
When I view the the website's footer in the mobile preview, it looks fine. But when I view it on Mobile Safari/Chrome browsers, it looks bad.
I read the previous post on this issue, its solution didn't solve my problem.
Here's a share link: https://preview.webflow.com/preview/nbl-design?preview=63b79cb367af9623839b2ad3548d6163

Thank you,
Naama.



#2

It's a pretty basic footer, you could try not using flex. Float right and then align center on mobile breakpoints.


#3

Hi @Naama

As @r_rosenow suggested, you can remove the flexbox settings and use display: block to fix the overlapping elements in your footer.

Here is a GIF for you:

Hope this helps :slight_smile:


#4

Thank you very much both @Brando and @r_rosenow.
Another question - what tool do you use to create this gif?


#5

You can learn more about GIFs here.


#6

Thank you @r_rosenow!


#7

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