Mobile responsiveness loads in desktop view.

[Scraayp]

Hey there,

I've recently made a website with nextjs and tailwind. I have come across a problem. My mobile view (devtools), looks like it's being loaded as an desktop application. Which you're able to see on the screenshot below. I've been looking at the tailwind config file for hours now, trying to find a solution. Still haven't come up on anything. Could you please tell me how I could fix this!

Desktop view: https://imgur.com/a/gjqx1sk
Mobile view: https://imgur.com/a/gAv1m3h

Tailwind config: https://gist.github.com/Scraayp/882fdc9178fcd7003a69d70bf016dc85

Update: The mobile screen shows how it's supposed to only for 1 sec. Please see the navbar in this video.
https://youtu.be/BZ5zQS-_Bbs

Already, thank you!

[wongjn]

Consider checking you have the viewport meta tag in the webpage, commonly:

<meta name="viewport" content="width=device-width, initial-scale=1" />

Otherwise, consider providing a remotely-hosted git repository or similar that reproduces the unexpected behavior.

[Scraayp]

I have this as my viewport code:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

I'll look into sharing my code.

[KevinPadi]

I had the same issue and I solved it thanks to your comment, 🙏👍Thank you so much!

[Scraayp]

I have found out that my viewport is not being included by NextJS into my website. That would be the problem! Thank you for the help!