Column width change after 1.6.7 update

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #15805


    Hi there…

    We have been running Data Tables Generator by Supsystic for about a half year.

    This is regarding a 6 column table with some merged cells.
    The first column has always been about 1/3rd the width of the other columns but with this last update, it is now the same width which is throwing everything off.

    Using Firefox’s and Chrome’s inspectors as well as the CSS sheet for the table, I have tried changing #supsystic-table-4 tbody td:first-child using width as well as max-width but neither changes the width while I can change things like padding and background color.
    I have also tried including !important.
    I have also adjusted the column width using the drag interface but that also makes no change.




    As a short follow-up, I find that under “Design”, if “Responsive Mode” is set to “Disable Responsitivity”, the table formats correctly with the first column more narrow than the others but of course, on mobile screens with responsive mode off, the table is unreadable. And this particular table needs to be maintained with all columns and rows in place and visible to understand the info so the other responsive modes are not useful either.


    Hi @daine

    Thank you for contacting us about Data Tables Plugin question.

    In order to change the column width, please insert the next code

    ‘#supsystic-table-225 tr td:first-child {
    width: 30%;

    inside CSS Tab –

    where supsystic-table-225 – 225 is the id of your table
    and :first-child – for the first column

    Also you can read more about it here –


    Hi @daine

    Also in the case it will not help, please provide the page link on your site with the issue.
    Thus we will see whats wrong and help you. As so the Data tables css styles can be overridden by styles of your site theme or plugin.



    Hello mila_support and thanks for the response…

    Using % or specific px widths in the below CSS makes no change.
    #supsystic-table-4 tr td:first-child {
    width: 30%;

    I understand that the table CSS can be overridden but usually, adjusting in the browser inspector will cause a change as it is truly at the end of the process and even there I do not seem able to cause the column to resize.

    Anyway, the table as it should look can be seen here:
    This table is set with Responsive Mode disabled to allow the proper formatting.

    The table with Responsive Mode set to Horizontal Scroll can be seen here:



    Hi @daine

    Thanks for links with the table.

    1. There is an error on your page – you can see if you press F12 and chose developers console. It can also affect on the table displaying. You can fix it by yourself – just delete the highlighted code on the screenshot – or contact your site developers.

    2. Please contact us via our internal support. We will help you to solve the issue.

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.
Thanks so much! Please Enter Your Info Below To Get PRO Discount and Gifts