How Do I set up custom column width for mobile phones?

Resolved Shwepps
(@shwepps)

5 years, 7 months ago
How Do I set up custom column width for mobile phones and small-screen devices in general?
I’ve tried this stuff (looked into my css-theme):
```
@media screen and (max-width: 980px) {
.tablepress .column-1 {width: 30%;}
}
```
But nothing has changed…Any help is greatly appreciated.

Viewing 11 replies - 1 through 11 (of 11 total)

Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago

Hi,

thanks for your post, and sorry for the trouble.

That will not really work, as you can not make columns smaller than what the content in them dictates. You might therefore want to take a look at the possibilities offered by https://tablepress.org/extensions/responsive-tables/

Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

Regards,
Tobias

Thread Starter Shwepps
(@shwepps)

5 years, 7 months ago

I’ve tried responsive tables and they didn’t work as I need.

That will not really work, as you can not make columns smaller than what the content in them dictates

Ah, ok then.

Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago

Hi,

what would you need? 🙂

Regards,
Tobias

Thread Starter Shwepps
(@shwepps)

5 years, 7 months ago

Um, the ability to change column width and make it smaller even if the content (in my case the images) size is bigger than the width itself. Is this possible?

Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago

Hi,

yes, to some degree. To find a good CSS solution, I’d need to see the page directly. Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

Regards,
Tobias

Thread Starter Shwepps
(@shwepps)

5 years, 7 months ago

Link
This is an another example.
Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago
Hi,

thanks for the links!

For this table, the “Custom CSS”
```
.tablepress-id-1 img {
    max-width: 100%;
}
```
should be sufficient.

Regards,
Tobias
Thread Starter Shwepps
(@shwepps)

5 years, 7 months ago
Seems to work!
It can be used globally for each table, like this:
```
.tablepress img {
    max-width: 100%;
}
```
Right?
Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago

Hi,

correct, that would apply this setting to all tables on the site.

Regards,
Tobias

Thread Starter Shwepps
(@shwepps)

5 years, 7 months ago

Thanks a lot! Case solved)

Plugin Author TobiasBg
(@tobiasbg)

5 years, 7 months ago

Hi,

no problem, you are very welcome! 🙂 Good to hear that this helped!

Best wishes,
Tobias

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘How Do I set up custom column width for mobile phones?’ is closed to new replies.