Problem of gaps on the sides and of responsiveness on large format

Hello everyone,

As you can see in video 1, the image is not responsive from the moment I’m in 2560 px x 1440 px. The screenshot was taken on an iMac. However, I don’t have any problems of this kind when I run responsive tests on an online tester.

Concerning video 2, when I move the mouse from left to right, I get a “gap” on the right side.

Can you help me?

Here’s my site in read only : Webflow - Omnis Design
Video1Video2

Best

Antony

hi @Antony_Doria I have now looked into your build and there is too many wrong decision made like using margin-left: 481px, setting image size with 30vh or 100rem for width and height , wrongly use position: absolute etc. etc. After spending like 30min on your read-only to find how to fix it the best decision I will suggest (after I saw what has been done) is to build it again from scratch correct way as it will save you lots of trouble later.

1 Like

Hi, thanks for your help and your reply.

Do you mean I have to redo the whole site or just the first page?

Thanks

I can’t say As I have only looked on page with Issue. It is up to you to decide what to do with rest.

**I just have a problem with the general margins and the photo of the first page in large format. from 2460 pxl…

would it be possible to adjust the margins? i can remove the photo… the biggest problem is the “empty” margins…

does this come from a margin error in the first “section” or from the image itself?

thanks**

hi @Antony_Doria if there will be as simple solution just to change a few things I will post solution but in this case it is not possible as there is too many issues.

Anyway one issue is with your lottie in nav, just set it to correct values or just reset it. Another issue is with your heading wrappers, another issue is your grid where images are there is padding margin etc. Try to hide these sections and unhide one you will work on and try to fix it. best practice is work only one section at the time and make it work from desktop to mobile. Once is fixed unhide next section, than …

But it IMO will take more time than stripe down classes cleanup unused and start again with different or correct solution.

1 Like

hi @Stan , thanks a lot. I’ll make a backup, do some tests tomorrow and get back to you :slight_smile:

Hello Stan,
I’ve solved a lot of problems, thanks again for your advice.

however, when i test the tablet responsive, the layout leaves the previous section sticking out. do you know how to fix that?

Here’s a screenshot of https://responsivetesttool.com/ and my read-only site.

Many thx !
strong text