Same table, different column widths

Hi,

thanks for your post, and sorry for the trouble.

This should be no problem with the approach from https://tablepress.org/faq/column-widths/ (if the content in the cells allows it):

.tablepress-id-123 .column-1 {
  width: 20%;
}
.tablepress-id-123 .column-2 {
  width: 25%;
}
.tablepress-id-123 .column-3 {
  width: 25%;
}
.tablepress-id-123 .column-4 {
  width: 30%;
}

Please change the 123 to the correct table ID.

Regards,
Tobias

Thanks Tobias! I realize now that I didn’t explain fully.

While those would be the widths of row 2, row 1 would have different widths, and row 3 would also have different widths. Is this possible with TablePress?

Hi,

the border lines of the columns will still need to be “connected”, i.e. the grid has to be used. However, that CSS code should achieve what you described above (even with the colspan).
Please try it. If it does not work, 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

Hi Tobias,

Thanks again, but still no luck. ?? I have a three-row table with each column at a different width, so I think the CSS would be something like this:

ROW 1:

.tablepress-id-1 .row-1 .column-1 {
width: 15%;
}
.tablepress-id-1 .row-1 .column-2 {
width: 30%;
}
.tablepress-id-1 .row-1 .column-3 {
width: 30%;
}

ROW 2:

.tablepress-id-1 .row-2 .column-1 {
width: 42%;
}
.tablepress-id-1 .row-2 .column-3 {
width: 35%;
}
etc.

The styles above simply make the first column in each row the same width, no matter what I do. Maybe it will be easier to show an example of what I’m trying to accomplish. I’m trying to do something similar to the table on this page:

https://georgeremus.com/the-bourbon/straight-bourbon-whiskey/

Looking forward to your thoughts!

Hi,

ah, I see. Sorry, that’s not possible with an HTML table, due to its fixed grid structure, just like e.g. in Excel. While you can merge cells, it’s not possible to have the cells have individual (different) widths.
You would need other HTML structures, e.g. based on <div> containers with CSS code for this.

Regards,
Tobias

Well, darn. Thanks for letting me know.

Hi,

sure, no problem! Sorry that I didn’t have better news here.

Best wishes,
Tobias