Viewing 15 replies - 1 through 15 (of 18 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    can you please post the link to the page with the table? There’s probably some theme CSS also influencing this.

    Regards,
    Tobias

    Thread Starter jphipps

    (@jphipps)

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for the link.

    Instead of what you posted above, please try

    .tablepress-id-2 .row-1 td {
      font-weight: bold;
      vertical-align:middle;
    }

    The “td” part is necessary here, as we need to target the cells directly.

    If you also want to center the text horizontally, add

    text-align: center;

    into the selector.

    Regards,
    Tobias

    Is there a code that can align all of the numbers to the right side of the second column.

    http://www.kanataimmigration.ca/permanent-residence-and-processing-fees

    Also, some of the second column numbers are not aligned how do I fix that?
    tried entering this but it didn’t work
    .tablepress-id-2 .row-1 td {

    vertical-align:right;
    }

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your question.

    You’ll just need this “Custom CSS” instead of what you posted:

    .tablepress .column-2 {
      text-align: right;
    }

    I noticed something else: For most tables on that page, you have deactivated all of the advanced features by unchecking the individual checkboxes. The better way to do that (results in better performance) is to just uncheck the “Use DataTables” checkbox for each of these tables.

    Regards,
    Tobias

    I have tried to follow this example and the text looks correct in preview but not on live page….

    http://www.newchurchnc.org/groups/

    It is the first table on this page I am trying to work with…

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    when working on columns, you must not put in the td after the .column-123 in the selector. So, please replace

    .tablepress-id-2 .column-2 td {
    	vertical-align: middle;
    	text-align: center;
    }
    .tablepress-id-2 .column-3 td {
    	vertical-align: middle;
    	text-align: center;
    }

    with

    .tablepress-id-2 .column-2,
    .tablepress-id-2 .column-3 {
    	vertical-align: middle;
    	text-align: center;
    }

    Note that I also shortened and optimized the code by grouping it.

    Regards,
    Tobias

    i have replaced it but still no luck….

    in my code the words “middle” and “center” are in red….is that normal?

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    ah, it looks like your theme also has CSS code that influences this. So, we just need to be a little bit more precise in the CSS. Please try again with

    #main .tablepress-id-2 .column-2,
    #main .tablepress-id-2 .column-3 {
    	vertical-align: middle;
    	text-align: center;
    }

    And yes, the red color for these words is normal. Don’t worry too much about this, it’s just a visual indication to spot “property” and “value” more easily.

    Regards,
    Tobias

    perfect! thanks so much for your help…..i love this plugin

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    awesome! Good to hear that this worked 🙂

    Best wishes,
    Tobias

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

    Tobias,

    I have tried the above CSS for my table that I’d like to have the text centered but it’s not working for me. I only need to do this for an entire table, not specific columns, so I put in the following:

    .tablepress-id-1 {
    vertical-align: middle;
    text-align: center;
    }

    Here’s a link to the page … very bottom, the Age Award Categories.

    P.S. Everything seems to be bold too and I’m not sure why.

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    First of all, please uncheck the “Table Head” and “Table Footer” checkboxes for this table. Those do not make sense here, from a semantical point of view. The background color of the table will then change, but you can then change that again with some CSS code that is shown in the TablePress FAQ.

    Then, to center the cells, please use this “Custom CSS” code:

    .tablepress-id-1 td {
      vertical-align: middle;
      text-align: center;
    }

    Regards,
    Tobias

    Thank you sir! Got it working, only thing I’m running into is no border at the top of the table. I do have custom CSS for this which is …

    .tablepress td {
    border: 1px solid #000000;
    }

    And, is it possible to center the Table Name?

    Thanks!

Viewing 15 replies - 1 through 15 (of 18 total)
  • The topic ‘Align row text’ is closed to new replies.