Left Align one column only

  • Resolved tspnyc

    (@tspnyc)


    3 years, 8 months ago

    I need to be able to change the text alignment in one table. Actually, three or four tables, but I have yet to make the others.

    I do not want to align all columns in all tables, or even all columns in the individual table. I just want to left align text in column 3 of [table id=16 /].

    And then do the same with some future tables.

    I have seen old queries on-line about this question of changing the alignment of ONE column from Center to Left, and the answer is…

    “Add something like

    .tablepress thead th,
.tablepress tbody td {
  text-align: center;
  vertical-align: middle;
}

    and it should work fine”

    1) If that code is being added to the CSS for the entire TablePress plugin, how does that solve the problem of Left Aligning one column in one of the 16 tables I have made using TablePress?

    Also, the code as suggested says ‘center’ and ‘middle’ so does that mean I should change ‘center’ to ‘left’?

    And asking as someone who has used WP for 10 years while avoiding CSS 99% of the time, do I add this code by going to the very end of the Frontend Options and Styling CSS, and hitting Return once, and then pasting it in the code written above?

    Thank you

Viewing 1 replies (of 1 total)
  • Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    You are very close! The code you posted would indeed align all cells in all tables. To only apply that change to a single column of a single table, you would use “CSS classes”. TablePress adds a few of them to the table elements, for various purposes. For a list, please see https://tablepress.org/faq/documentation-css-selectors-styling/

    In your case, the CSS code could look like this:

    .tablepress-id-16 .column-3 {
  text-align: left;
}

    (note that left alignment normally is the default value, but your theme or other CSS code might have changed that).

    And yes, you would change that center string to left (or right) here.

    And again yes, for your described procedure on how and where to add the CSS code to the page ??

    Regards,
    Tobias

Viewing 1 replies (of 1 total)
  • The topic ‘Left Align one column only’ is closed to new replies.