• Resolved alexanderweb

    (@alexanderweb)


    I have tried very hard to adjust the width of my columns and centre the table on my first attempt at a TablePress Table as below but always the table shows on the left hand side of the page.

    This code in the Additional CSS

    .tablepress-id-1 .column-1,
    .tablepress-id-1 .column-2,
    .tablepress-id-1 .column-3,
    .tablepress-id-1 .column-4 {
    width: 100px;
    }

    .tablepress-id-1 thead th {
    font-family: Tahoma;
    font-size: 14px;
    font-weight: bold;
    color: #005580;
    }

    .tablepress-id-1 tbody td {
    font-family: Tahoma;
    font-size: 14px;
    font-weight: bold;
    color: #1a1a1a;
    }

    .tablepress-id-1 {
    width: auto;
    margin: 0 auto 1em;
    }

Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter alexanderweb

    (@alexanderweb)

    Still working away and enjoying using TablePress and I have discovered that if I untick the use Data Tables I can get the table to centre nicely.

    As I want to use the Data Tables features (which are excellent) how then can I get my table centred as 500 px in width.

    Any help appreciated but finding the features great.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    Can you 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

    Thread Starter alexanderweb

    (@alexanderweb)

    Getting closer by looking at previous posts.

    I think the search box is stopping me centring but cannot find a way to get the search box on the same line as the filter boxes but will keep trying.

    Thanks

    • This reply was modified 5 years, 2 months ago by alexanderweb.
    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for the link!

    You are actually suffering from a bug here. Normally, the table stretches to 100% of the widths. To achieve that, please add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

    .dataTables_wrapper .tablepress {
      width: 100% !important;
    }

    If you then still want to reduce the width and center it on the page, you can also add

    #tablepress-1_wrapper {
      width: 400px;
      margin: 0 auto 1em;
    }

    Regards,
    Tobias

    Thread Starter alexanderweb

    (@alexanderweb)

    Many thanks Tobias and really like the layout of the tables and once I understand more about css I will enjoy it even more.

    Will update you shortly.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    no problem, you are very welcome! 🙂 Good to hear that this helped!

    Best wishes,
    Tobias

    P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!

    Thread Starter alexanderweb

    (@alexanderweb)

    Will do Tobias and thanks again

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    always happy to help! 🙂

    Best wishes,
    Tobias

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Centring Table and Colum widths’ is closed to new replies.