Website not optimising for Mobile

So, I made my website, and it looks good (how it should look) on Desktop. The problem is when I view my website on Mobile. When I run the website on the Blocs Preview, it looks fine.

But…

When I run the website on my phone, it doesn’t for Mobile. I have attached some screenshots below to help with my explanation.

Screenshot of the website on Desktop:

Screenshot of how the website should look on Mobile:

Screenshot of how the website on Mobile:

Does anyone know how to fix this problem?

Thanks in advance :slight_smile:

Hello,

Your last screenshot looks more like small tablet or phablet display size. You can adjust how it looks in SM breakpoint in your Blocs Project.

It looks like a small tablet, but that is how it looks on moblie

Could you please share the screenshot of how your SM breakpoint in Blocs preview looks?

Sure!

What is a SM breakpoint? haha sorry for the noob question

11%20AM

By the way, if you haven’t already, check out my free Getting Started with Blocs course. It will answer some of your questions.

1 Like

Sure, I’ll check it out later today :slight_smile:

Here is my SM screenshot

Well, I guess it is not even SM. Do you have the menu toggle enabled on MD breakpoint?

The MD has the normal navbar menu

Ok, so this is what you get on your last screenshot. Breakpoints allow you to edit how webpage looks depending on the width of the screen. The mobile screenshot you sent has a width close to MD breakpoint. If you check your website on real mobile phone screens, it will show you the toggle menu like you have in SM and XS breakpoints.

But when I look at my website my mobile phone, it looks like the MD and SM.
If you would like to take a look, go to www.qlt-media.com

Could you please send me the project files by PM. I will take a look at it.

For sure, but I am not sure how haha

Again, sorry for my noobness haha

Maybe you can send me a message and that will allow me to send you the project file

In case anybody else has this issue, check the Fixed Viewport option in the Page Settings.

Cheers,
Eldar

1 Like