Trying to apply desktop mode across all devices

Hi @darivers71 , you could probably do that with additional coding, yes. It’s outside the scope of our support, though, and I would imagine it could make your site less mobile-friendly in the end. Most people wouldn’t be able to read the tiny fonts.

Do you want to share what accessibility issue you’re encountering on mobile, though? Perhaps we can help with that. Send a link to the affected page, and let us know what you’re seeing there, and what device and browser you’re using. Thanks!

Well my thing is the mobile format jams up data & tables, where I’d like to have items fit on screen, even with the smaller font settings. There are other aspects I’d like to address as well.

Example 1: https://rpr-ratings.com/rated-seasons/2022/

If I have table set at no width (or wide/full), then the table is set where you have to side scroll in mobile mode. If I have it set to align center, it jams the table columns up, degrading the view of the page.

Example 2: https://rpr-ratings.com/rated-seasons/

I have a table automatically with jammed data and not viewing the way I want. This is also set on lowest font setting in the block editor

I want my tables to statically fit on screen without loss of format. For a reference, I want you to check out Tip Top 25, a website similar to the goal of my site. If you compare viewing this site on a desktop/laptop and viewing on a mobile site, there is little to no difference in the view and tables fit on screen without distorting data.

Hey there,

Many thanks for providing those examples.

To reassure you on a mobile, the content/table is not cut off, but instead adapts a scrolling affect. Are you seeing that on a mobile.

To change that you would need some coding.

A workaround, could be to use an image of the table perhaps?

Using an image of the table will not be feasible.

Here’s what I want to make happen: no horizontal scrolling effect on my tables. I want them to fit on the screen. I’ve tried using smallest font possible in editor, I’ve tried different alignments – everything is either still gonna enforce horizontal scrolling in mobile or distort the inputted data to make the table fit (making the table unreadable). So what to do I need to do to code that into my site so that tables will fit on any screen?

If the same effect is possible with columns (as I’ve used columns to try to incorporate some visuals), I would like to see if’s possible to make columns fixed in a manner that they can appear on screen in mobile without distortion/overlap of items.

Hey there,

Because the table is currently of a responsive design, this CSS:

.wp-block-table table {
    word-break: break-all;
    font-size: x-small; 
}

Would result into something like that:

so in other words, I’m just pissing in the wind here seeking help for what i’m trying to accomplish. got it

Hey there @darivers71

I’m not sure I’d use those words exactly…

To explains, I put forth that Tip Top 25 is using out of date practices when it comes to their site, which has the potential to affect their SEO.

To explain, Google will drop websites from mobile searches that aren’t responsive, or display text that are too small or using links are hard to hit on a mobile device….etc.

This guide here explains more about responsive design: https://web.dev/responsive-web-design-basics/.