Help: Responsive Website

I created a site… I tried to make it RESPONSIVE. Problem: seen from mobile and scrolled down it still shows a huge empty space. They tell me to fix padding - margin… can anyone among you help me? I don’t want use div’s…

URL: https://cristianleandri.altervista.org/

Thanks in Advance,

Cristian. :wink:

While i’m sure the CSS gurus can suggest something shortly… who’s “they”, and why did they not tell you how to fix it?

Because they don’t have time… I hope someone can help me here! :smiling_face:

What gap do you mean exactly?

This is what I see on my Iphone SE

No gap at the bottom but a massive horizontal scroll.

I don’t see any responsive code in there at all. You just put it all in an table like it was 1999.

If you scroll down there is a huge empty space, how can remove and fix it?

That doesn’t happen on my iphone SE as shown by the screenshot I posted.

I expect what is happening is that as your page is too wide for a mobile screen some mobiles will increase the horizontal and the vertical scrollbars in sync until the element is fully contained horizontally.

As a test try adding this css and retest.

 html,body {
  overflow-y: auto;
}

It may do nothing but is worth trying.

The correct answer though would be to remove the tables altogether and code the site responsively. At present with your structure the only other thing I could offer would be to add css to linearize everything on small screen so that its only one item across..

e.g.

1 Like

It Works! THANKSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSSS!!!
Greetings from Italy!
Cristian. :heart_hands:

2 Likes

I don’t know if Paul agrees, but this seems to be a sticking plaster solution.

As an alternative to tables it might advisable to use css grids instead. This will give you better control over making your site responsive for desktop and mobile. Here are a couple of videos that are hopefully of interest.

2 Likes