Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #1303229

    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.


    • This topic was modified 2 years, 10 months ago by Saskbison.

    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,


    Perfect! Works exactly how I need it to.

    Thank you for your help, Ismael!



    I’m glad this was resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Table columns custom colored cells’ is closed to new replies.