Column Cut Off in Certain Browsers

Hi,

thanks for your question, and sorry for the trouble.

I’m not really sure why this happens, I assume that IE is interpreting some of the CSS differently.

Can you please try again after turning off the DataTables JS library on the table’s “Edit” screen? That should make it easier to investigate this, and might even help as the CSS that tries to reduce the image width could then work.

Regards,
Tobias

Thank you for your quick response.
To be honest, I’m not sure how to do what you asked. I went into the edit area and looked at both of the areas with “JS” and they both said inactive.
I hope this helps.
Thank you.

Hi,

on the “Edit” screen, there should be a checkbox that says “Use DataTables”. Please uncheck that one.

Regards,
Tobias

Oh I see! It’s already unchecked.

Even with it unchecked though, the 3rd column is still cut off.

Hi,

I’m not really sure, why this is happening ??
You could maybe work around this by setting the padding in the cells to a smaller value:

.tablepress-id-4 th,
.tablepress-id-4 td {
  padding: 0;
}

Additionally, please uncheck the “Table Head” checkbox as well.

Regards,
Tobias

Thanks for these suggestions. That did help a little bit to move it over, but it’s still just a bit off center/cut off. It looks like there is a bit of extra space on the left side. Is there any way to put in code to center the table? I think that might do it.
Thanks!

Hi,

that code did actually not work, as it needs a higher priority. Can you please try again with

.tablepress-id-4 th,
.tablepress-id-4 td {
  padding: 0 !important;
}

Regards,
Tobias

Hi Tobias,
Thank you so much – that code worked, and all 3 columns are showing up!

Something strange happened though. The last 2 rows aren’t showing up in IE or Firefox, but they are fine in Chrome. Any idea how to fix this:

Here is the link again: https://www.jodichapman.com/365soulbonusgiftpreview/

Thank you!

Hi,

great! Good to hear that this worked now! ??

Regarding those rows not showing: I can’t reproduce that. The table rows are the same for me in Chrome and Firefox…

Regards,
Tobias

Hi Tobias,
One more question – it looks like everything works great when the table is viewed from a computer, but one 1 (sometimes 2) of the columns are showing up on mobile devices. Could you please let me know how to fix this? I checked the scrolling option, but it’s still not working. Thanks!

Hi,

thanks for your question, and sorry for the trouble.

Have you tried the scrolling mode that the TablePress Responsive Tables Extension from https://tablepress.org/extensions/responsive-tables/ offers? That should be the best option here.

Regards,
Tobias