Hey everyone!

With the holiday season upon us, we want to share our upcoming working hours:

After that, we’ll return to our regular schedule and assist you as quickly as possible.

In the meantime, you can explore our documentation for Amelia and wpDataTables. You'll find tons of helpful resources, including articles and handy video tutorials on YouTube (Amelia's YouTube Channel and wpDataTables' YouTube Channel), which might just have the answers you need while we’re away.

Thanks a bunch for your understanding and support!

Warm regards and happy holidays!

TMS

Okay
  Public Ticket #3426604
Why some tables are center align but some are NOT?
Closed

Comments

  • Joshua Lim started the conversation

    Hello,

      Anyone can help me? I want to know how can I make all the datatables having center aligned for all the cell.

      Currently, I have multiple of datatables but some tables the cell are NOT center alignment.

      Anyone else having this problem? Please advise how you solve this issue?

    Best regards,

    Joshua Lim

    Attached files:  wpdatatable not center align.png

  • Joshua Lim replied

    Custom JS and CSS page, there is something I don't understand, anyone able to help?

    Attached files:  td totheright.png

  •  1,847
    Miloš replied

    Hi Joshua,

    1. In regards to the Custom CSS you sent on the screenshot :

    i can see that here there is a class named 'totheright',

    8948442461.png

    So check in your Column settings/Display settings,

    if you added this class for some columns.

    Any column that has that class is going to have text in the cell aligned to the right side.

    For example, if i have a table, and in one Column i add this class :

    9346716000.png

    Then in Custom CSS add this :

    td.totheright {    

     text-align : right !important;

     }


    6181653271.png


    Then any column with that class will align to the right.

    1263761762.png


    2. Now, for centering the text/data in cells :

    For example, if you just want to center all the data in the entire table, you can add this CSS to table's Customize/Custom CSS:

    .wpDataTablesWrapper table.wpDataTable td.numdata, .wpDataTablesWrapper table.wpDataTable th.numdata{
     text-align: center !important; 
    }
    .wpDataTablesWrapper table.wpDataTable > thead > tr > th {  
         text-align: center !important;  
     }
    .wpDataTablesWrapper table.wpDataTable td {   
        text-align: center !important; 
      }
    

    If you want this for all tables, paste this code in main plugin settings/Custom JS and CSS/Custom CSS.

    -

    But in case if you need to center data only in specific columns,

    then you can first add a CSS class to this column:

    9497508940.png

    And then you can call this in Custom CSS of the table :

    td.center {
     text-align: center !important;
    }

    Let me know if that helps?smile.png Thank you




    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables

  •   Joshua Lim replied privately
  •  1,847
    Miloš replied

    Hi Joshua,

    the String/text data is aligned center by default in our Plugin.

    But the numbers/ float and integers, they are aligned to the right.

    You can find this option in Main Plugin settings : Align Numbers ( if you need them centered, just disable this)

    4767120723.png

    Here are couple screenshot as examples, how my table looks by default, you will see all the String Columns align to center, but numbers to the right :

    3587349633.png

    When i change this, then all is centered :

    1044105800.png

    If this is different on your end,

    please check did you add any Custom CSS with "text align" properties in any of your Tables?

    Thank you.

    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables

  • Joshua Lim replied

    Dear Milos,

      Really thanks for your support but maybe I cannot explain the detail clearly.

      All my tables are mostly numbers (float) columns, https://ps-indicators.com/klinesaw2441h/ you see all are center aligned but these 4 tables not all are make the same. Some tables, I need to go into all the column and switch Column cells alignment to "center" but some table are default already center. If I have 100 of these tables, then all the column I need to manually adjust to center. This solution also not perfect, if I have Sum, Ave, Max & Min enable, those cells are not center alignment using this method.

      I wish I can find a solution to this problem and all my tables will be Default center alignment without any setting.

    6209786316.png

    this is the 1hr table and I need to change the Column cells alignment to "center" for all the table.

    1621559266.png

    this is the 4hr table : When appear on screen, all are center alignment without changing any setting.

    5547570376.png

    How can i get someone to visit my website to check this bugs via zoom, I can show you all these issue and the detail? If not, I will have tons of work to do. I have been with wpdatatables for 2-3years.

    Many thanks.

    Joshua Lim


  •  1,847
    Miloš replied


    Hi Joshua,

    sorry for the waiting time.

    If I understand, basically you wish to 'force' all tables to have everything centered in cells,

    numeric data and string data?

    Can you please try this,

    add this CSS code, in your main Plugin settings/Custom JS and CSS/Custom CSS :

    .wpDataTablesWrapper table.wpDataTable td.numdata, .wpDataTablesWrapper table.wpDataTable th.numdata{
     text-align: center !important; 
    }
    .wpDataTablesWrapper table.wpDataTable > thead > tr > th {  
         text-align: center !important;  
     }
    .wpDataTablesWrapper table.wpDataTable td {   
        text-align: center !important; 
      }

    After this, all tables should have centered data in cells by default.

    Let me know if that helps.

    If not, can I remotely log in and take a look?

    Please provide me a temporary WP-admin (administrator) user for your site where this happens, so we could log in and take a look ‘from the inside’ as that’s the most efficient way to see and resolve the issue. 

    We do not interfere with any data or anything else except for the plugin (in case that’s a production version of the site), and of course, we do not provide login data to third parties. 

    You can write credentials here just check PRIVATE Reply so nobody can see them except us.-

    -

    Our support does not provide live calls or meetings,

    but we can help.

    If you can confirm a couple of Table ID's and we will take a look.

    Thank you.


    Kind Regards, 

    Miloš Jovanović
    [email protected]

    Rate my support

    Try our FREE mapping plugin! MapSVG - easy Google maps, interactive SVG maps and floor plans, choropleth maps and much more - https://wordpress.org/plugins/mapsvg-lite-interactive-vector-maps/

    wpDataTables: FAQ | Facebook | Twitter | InstagramFront-end and back-end demo | Docs

    Amelia: FAQ | Facebook | Twitter | InstagramAmelia demo sites | Docs | Discord Community

    You can try wpDataTables add-ons before purchasing on these sandbox sites:

    Powerful Filters | Gravity Forms Integration for wpDataTables | Formidable Forms Integration for wpDataTables | Master-Detail Tables

  •   Joshua Lim replied privately
  •   Miloš replied privately