Tagged: data table, Pricing Table, table, table columns
Hello Enfold Team,
I’m having a few customization issues regarding the table.
First, I want to define the width of the column to be 1/3 of the table width.
Next, I want to make each cell in the first column a different colour (like in the attached image).
I’ve tried suggestions from a few different threads to no avail.
Thanks!
Em
Hey Saskbison,
Thank you for the inquiry.
This should adjust the width of the first column.
#custom-table-1 tbody tr td:nth-child(1) {
vertical-align: middle !important;
width: 30%;
}
To change the color of the cell in each row, try this css code.
#top #custom-table-1 tbody tr:nth-child(1) td:nth-child(1) {
background-color: red !important;
}
#top #custom-table-1 tbody tr:nth-child(2) td:nth-child(1) {
background-color: green !important;
}
#top #custom-table-1 tbody tr:nth-child(3) td:nth-child(1) {
background-color: blue!important;
}
We used the nth-child selector to target each table row (tr) element.
Best regards,
Ismael
Perfect! Works exactly how I need it to.
Thank you for your help, Ismael!
Emily
Hi,
I’m glad this was resolved. If you need additional help, please let us know here in the forums.
Best regards,
Jordan Shannon