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 #3521714
Change width of simple table to align with other text
Closed

Comments

  • Ranan Branbergen started the conversation

    Hello, 

    I am styling my tables and i want to change the width of a simple table. I have looked into your documentation. But i can't seem to find a way to change the width of the tables that i am using (https://nationaletheegids.nl/listing/yerba-mate/?preview_id=1866&preview_nonce=6913430fc5&preview=true).  

    Could you please instruct me how i can change the width of these tables so i can align the table with the other text (see attachment) 

    Thanks

    All the best,

    Ranan

    Attached files:  Change widt of simple table to align with other text.png

  •  1,847
    Miloš replied


    Hi Ranan,

    Firstly, I would like to sincerely apologize for the delayed response as we have been experiencing an unusually high number of tickets. I am sorry that it has taken longer than usual to respond to your concern and your patience is highly appreciated.

    -

    1. I am not able to see your Page, because it says this is a Draft, that needs a logged in User in order to view it.

    2250479663.png


    2. But we will show how you can add custom Column width to Simple Tables, and let me know if that helped.


    You can add a CSS class directly in a cell of a table,  and then you can edit, for example, for cell number 1 :

    <div class="abc">Some text 123</div>

    Then on the front end, we would add this custom CSS:

    td .abc {
       width: 350px;
    }

    and this will change the column width on the front-end.

    It is a similar method to do any CSS rules that you wish to apply.

    -

    If you wish to add the same CSS to all tables, you can add this to main plugin settings/Custom JS and CSS/Custom CSS.

    Then, any Column in any Table that has that Class, is going to get this style applied, to have that width.

    Of course, you can create different width for different Columns, just add several Classes and input which width you need for each class.

    -

    Let me know if that helped.

    If you need something different, can you please show us a bit more screenshots or a Video to clarify what is the goal, and we will do our best to advise?

    If the Video contains any sensitive Data, or if you send us login data to see your Page, please mark the reply as PRIVATE for security reasons, then only we can see it.

    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