1: Some Pages not scaling on mobile devices
Posted by Paul.E on 19/03/20 14:21

I inherited this website as it moved to Voice (Thanks to Voice for all they do BTW).

On our website, we have some pages that display correctly on mobile devices e.g.

https://www.stoneleighlibrary.org.uk/mailing-list/

but on others, the text just heads off the side of the mobile screen e.g.

https://www.stoneleighlibrary.org.uk/news/

I didn't set these pages up and wondered if it was to do with the table or cell properties making some pages misbehave. I cannot seem to identify any culprit though.

Could anyone suggest why this may be?

Many thanks in advance.

 

 

 

 

 

2: Re: Some Pages not scaling on mobile devices (response to 1)
Posted by Alan-Parry (Euphonix Admin). on 19/03/20 15:15

Hi Paul

Have you any boxes or lines on the page where you are using pixels rather than percentages?  If so, change to percentages and that way they should hopefully adjust on mobile devices.  Let me know how you get on.

Alan

3: Re: Some Pages not scaling on mobile devices (response to 2)
Posted by Roger Philip on 21/03/20 17:35

I have the same problem with the home page on www.burrington-pc.org.uk. the home page is mostly within a table and is not re-sizing with different monitors or devices.  I cannot see what I may have done to make this happen, but it is frustrating at a time when I want to disseminate local community information.

4: Re: Some Pages not scaling on mobile devices (response to 3)
Posted by Alan-Parry (Euphonix Admin). on 21/03/20 18:37

Hi Roger,

Are the tables in pixels or percentages?  And is some of the text in tables without visible borders?

If the website has used pixels in the creation of these tables then I think the solution is perhaps relatively simple. Go into the table properties and change to percentages (whilst in theory you should be able to have 100% you might want to make it slightly less - it is all about experimentation).

If the table properties are already in percentages then maybe some of the html coding has become corrupted.  I happened to notice that your home page was rather long and wondered whether it would be easier to split it  into several topic specific sub-pages (this is what I did

5: Re: Some Pages not scaling on mobile devices (response to 4)
Posted by Alan-Parry (Euphonix Admin). on 21/03/20 18:43

Continued ...

for the Euphonix Choir website (euphonix.org.uk) - the homepage has several sub pages.  If you have subpages then identifying the problem may be easier to spot - sorry just an idea.

 Let me know how you get on.

6: Re: Some Pages not scaling on mobile devices (response to 1)
Posted by Voice Admin on 22/03/20 20:56

In the case of https://www.stoneleighlibrary.org.uk/news/, the content seems to be in a big table in which the left column is set to 60% width, and the right column to 350px.

The right column's fixed width will prevent it from scaling properly.

There are also other tables on that page with fixed widths, so they won't resize either.

As suggested elsewhere, the key for having tables behave well on different screen sizes is to ensure all column/cell widths are percentages and never a fixed number of pixels.

Thanks

Joe

7: Re: Some Pages not scaling on mobile devices (response to 6)
Posted by Paul.E on 30/03/20 15:54

Thanks Guys.

 

The pointers about fixed widths of columns have been incredibly helpful and have enabled me to fix some of our pages.

 

Others though just seem to refuse to scale properly.

 

For example on this page,

https://www.stoneleighlibrary.org.uk/classes-and-groups/

even if I delete the original content and just create a two-column table - with the table width set to 100% I get the left column displaying correctly on my phone but the right column is obscured. I have given up for now. It just seems a bit random.

 

Thanks for your help.