Can’t Set Column Width

Resolved dmpub
(@dmpub)

4 years, 4 months ago

Hi

This follows on from this earlier support request which I guess I marked as solved too quickly : https://wordpress.org/support/topic/col-width-and-horiz-scroll/

I can’t now specify column widths. It seems they are automatically being set based on the size of words in the heading row.

How can I now specify individual column widths and still keep a correctly scrolling table?

Tks

David.

The page I need help with: [log in to see the link]

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

Plugin Author TobiasBg
(@tobiasbg)

4 years, 4 months ago
Hi,

thanks for your post, and sorry for the trouble.

This is not directly caused by the scrolling, but more by the oversized table in general. Browsers simply don’t want a table to be too wide, which is why they will try what they can to make it as small as possible. This includes overriding CSS width commands that would make the table even wider.
Now, you maybe try forcing the larger width, by using the !important flag in the CSS (like
```
width: 180px !important;
```
) but I have seen mixed results with that. Instead, it might be better, for columns where this would be an option, to prevent automatic line breaks (as that’s usually what you really want to achieve by setting a larger width).
For that, you could use CSS like
```
.tablepress-id-2 .column-4 {
  white-space: nowrap;
}
```
Regards,
Tobias
Thread Starter dmpub
(@dmpub)

4 years, 4 months ago
Hi

Thanks for another fast reply.

Unfortunately, none of the three browsers I test with (Chrome, Firefox, Edge) honor the !important parameter.

The preventing auto line breaks isn’t quite what I want, either. I’m happy to have lengthy comments split to two or even three lines. But having one word per line is not really very good, and neither is having a table that ends up being ridiculously/dysfunctionally wide due to having all the contents of each cell on one line.

I had one thought. Maybe if I add some non-breaking spaces to the headings so as to force the columns wider on the basis of the heading sizes, that might work. I tried the   but that isn’t it. Do you know the code for nonbreaking spaces? Would that work?

Otherwise, is the bottom line there is no way to have a table that is wider than the column width defined in the WordPress layout, and to simultaneously be able to specify specific widths for specific columns?

David.
- This reply was modified 4 years, 4 months ago by dmpub.
Plugin Author TobiasBg
(@tobiasbg)

4 years, 4 months ago

Hi,

yes, that’s what I meant with “mixed results” :-/

Now, one idea might also be to turn off automatic line breaks in ALL columns. Then, you would be in total control over line breaks, as only places where used the “Enter” key on the “Edit” screen would result in a line break.

The idea with the non-breaking space should also work (I’m pretty sure I have seen that used), and   is the correct way – just don’t add “regular” spaces in between (as you have now) as those would then offer a possibility for the browser to add a line break. So, write the   directly after each other.

Regarding your bottom line: This has nothing really to do with WordPress, but with how HTML tables work in modern browsers. But yes, having a scrollable (and thus too wide for its container) table, and specify column widths that even increase the table width is not really possible.

Regards,
Tobias

Thread Starter dmpub
(@dmpub)

4 years, 4 months ago

You were right about the non-breaking spaces having spaces between them. I fixed that and now have sufficient control.

Thank you again.

Plugin Author TobiasBg
(@tobiasbg)

4 years, 4 months ago

Hi,

no problem! Always happy to help!

Best wishes,
Tobias

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

The topic ‘Can’t Set Column Width’ is closed to new replies.

Views