Background color of selected row can not be changed

Background color of selected row can not be changed

HendrikdbHendrikdb Posts: 5Questions: 2Answers: 0
edited September 2022 in Free community support

Hello,

My problem at the moment is that I can not change the background color of the tr or tds underneath the tr, of a selected row. This seems to be asked already but none of the propsed method work.

https://jsfiddle.net/csh0qy75/

This is a link to a test case (copy of html css and javascript from the example). Can you help me change the background color of the selected row to another one?

More strange is that with inspector I cannnot seem to find the css being used to set this abckground color. Am I missing something?

Thanks

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,343Questions: 26Answers: 4,954
    Answer ✓

    If you inspect the td of the selected row you will find something like this:

    table.dataTable tbody tr.selected>* {
        box-shadow: inset 0 0 0 9999px rgb(13 110 253 / 90%);
        color: white;
    }
    

    You should be able to override it with something like this:

    table.dataTable tbody tr.selected>* {
        box-shadow: inset 0 0 0 9999px rgb(255, 0, 0) !important;
    }
    

    Updated example:
    https://jsfiddle.net/Lc91jdqm/

    Kevin

  • HendrikdbHendrikdb Posts: 5Questions: 2Answers: 0

    Yes that seems to work, thanks for the help!

Sign In or Register to comment.