[Support request] Improve Tables On Mobile Display

[Sunil]

Dear Team

The tables on my website look deformed on mobile display and amp. Can you provide me with CSS to fix the same?

[David]

Hi there,

HTML Tables just aren’t natively responsive, and the core Table Block doesn’t provide options to make it so. The best option is to use a plugin like Table Press which adds that functionality.

Other then that the most we can provide is some CSS like this:

@media(max-width: 600px) {
    .wp-block-table {
        overflow-x: scroll;
    }
    .wp-block-table table {
        min-width: 600px;
    }
}

This will force the table to be sideways scrollable on smaller screens – adjust the 600px to suit.

[Author]

Posts