Wrong column width in table header row

Hi!

Thanks for your post and sorry for the trouble!

That does look strange, indeed. I’m not sure why this is happening. To further investigate this, please post me a link to the page with the table where this problem happens, so that I can take a direct look. Thanks! (Just from the screenshot, I can not investigate the cause for this, unfortunately.)

Best wishes,
Tobias

Hi Tobias,

Thanks! I have updated the plugin again, so you can view the issue on the URL that I added to the first post in this topic.

Best wishes,
Ronald-Jan

Hi,

ok, thanks for that! I’m not exactly sure, but it might be possible that the method for hiding columns with CSS is no longer compatible here (when Horizontal Scrolling is used).

Therefore, as a test, please remove this CSS code (from the respective selectors) for this table again:

.tablepress-id-1 .column-7 {
   display: none;
}
.tablepress-id-1 colgroup {
  display: none;
}

Then, instead hide this column with a different method. For that, please add this to the “Custom Commands” text field on the table’s “Edit” screen:

columnDefs: [
  { visible: false, targets: [ 6 ] }
]

Best wishes,
Tobias

Hi Tobias,

I removed the following CSS-codes:

.tablepress-id-1 .column-7, 
.tablepress-id-2 .column-7,
.tablepress-id-4 .column-7{
	display: none;
}

.tablepress-id-3 .column-5,
.tablepress-id-5 .column-5,
.tablepress-id-7 .column-5{
	display: none;
}

.tablepress-id-1 colgroup, .tablepress-id-2 colgroup, .tablepress-id-3 colgroup, .tablepress-id-4 colgroup, .tablepress-id-5 colgroup, .tablepress-id-6 colgroup, .tablepress-id-7 colgroup {
  display: none;
}

Your code seems to work, except for the tables with ID 3, 5 and 7 which have a different column that needs to be hidden. But after adjusting your code it works there as well.

columnDefs: [
  { visible: false, targets: [ 4 ] }
]

If you load the page you can see the column for a couple of milliseconds, so unfortunately it’s not as clean and fast as the previous CSS solution. But I’m glad that the table header aligns correctly again.

Kind regards,
Ronald-Jan

• This reply was modified 2 months, 3 weeks ago by ronald-jan.

Hi!

Yes, that would be the procedure for all tables then ?? (I wanted to first illustrate it for table 1.)

Good to hear that this helped! I will do some more tests, maybe I can find a way to make the previous CSS approach work again. You could maybe also try the combined approach (of using both CSS (but with the CSS that targets the colgroup!) and the “Custom Commands”).
Or, if you are not really needing the hidden column for anything, you could also hide it directly on the “Edit” screen as well, to prevent this visual glitch.

Best wishes,
Tobias