Hey everyone!

With the Labour Day holidays coming up, we’d like to let you know about our upcoming working hours:

Thursday, May 1st: Our team will be off during Labour Day.
Friday, May 2nd: We'll also be off for an extended holiday break.

We’ll be back on Monday, May 5th, ready to respond to all messages received during this time.

In the meantime, if you need help, feel free to:

https://www.youtube.com/@AmeliaWordPressBookingPlugin/videos

https://www.youtube.com/@wpDataTables/videos

Thank you for being so understanding, and we hope you enjoy the long weekend! 

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,894
    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