Unable to make the table transparent

  • Resolved csattotal

    (@csattotal)


    5 years, 2 months ago

    Hi, I tried the custom css code from another response. But its not working for me. Please suggest a method that will make the table transparent. I am using the Advanced table option. For other options, I see that the widget gives an option to choose background color but not for this option. I am not a coder, so appreciate detailed guideline on what to type in custom css box. Also it should not impact other tables in my website if possible. Thanks in advance.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Satinder Singh

    (@satindersingh)

    Background transparent will not provide perfect view of that dataTable because first 2 columns are fixed.

    Use below custom css to make all backgrounds black (it will not effect any other table):-

    div[id*="ccpw-datatable"].dataTables_wrapper .table-striped>tbody>tr:nth-of-type(odd),
#ccpw-coinslist_wrapper .table-striped>tbody>tr:nth-of-type(odd) td:nth-of-type(1),
#ccpw-coinslist_wrapper .table-striped>tbody>tr:nth-of-type(odd) td:nth-of-type(2),
#ccpw-historical_tbl_wrapper .table-striped>tbody>tr:nth-of-type(odd) td:nth-of-type(1) {
    background-color: #232323 !IMPORTANT;
}
div[id*="ccpw-datatable"].dataTables_wrapper .table-striped>tbody>tr:nth-of-type(even),
#ccpw-coinslist_wrapper .table-striped>tbody>tr:nth-of-type(even) td:nth-of-type(1),
#ccpw-coinslist_wrapper .table-striped>tbody>tr:nth-of-type(even) td:nth-of-type(2),
#ccpw-historical_tbl_wrapper .table-striped>tbody>tr:nth-of-type(even) td:nth-of-type(1) {
    background-color: #1a1a1a !IMPORTANT;
}
div[id*="ccpw-datatable"].dataTables_wrapper table.dataTable th[role=columnheader]:not(.no-sort) {
    cursor: pointer;
    background: #1a1a1a !IMPORTANT;
    color: #fff !IMPORTANT;
    border-color: #444 !IMPORTANT;
}
#ccpw-coinslist_wrapper .table-striped>tbody>tr td:nth-of-type(2),
#ccpw-historical_tbl_wrapper .table-striped>tbody>tr td:nth-of-type(1) {
    box-shadow: 2px 2px 4px 0px #464646 !IMPORTANT;
}
div[id*="ccpw-datatable"].dataTables_wrapper table.table-bordered.dataTable td {
    border-color: #444 !IMPORTANT;
}
div[id*="ccpw-datatable"].dataTables_wrapper div.dataTables_paginate a.paginate_button {
    color: #fff !IMPORTANT;
}
    Thread Starter csattotal

    (@csattotal)

    Hi SatinderSingh, I have added the code to custom CSS, but only the header row turned black and rest of the rows below remain with white background. Please check out at the same link.

    Plugin Author Satinder Singh

    (@satindersingh)

    please add above custom css inside your theme custom css section, not inside plugin custom css section and then check again.

    Thread Starter csattotal

    (@csattotal)

    It worked beautifully. Thanks a ton, Satinderji. This is awesome!!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Unable to make the table transparent’ is closed to new replies.