DataTables Center Text, but not for Parent Group Row

zgoforth

Hello,

I really like having the parent group rows text on the left side of the dropdown, I personally don't like how it looks when it is centered. Here is my test case: https://jsfiddle.net/BeerusDev/y8t0xoze/21/

I use

.table td{
    padding: 3px;
    text-align: center; 
}

and of course (as expected) it applies it to the parent group. Is there a a way to use psuedo elements to not select that row?

dtrg-group dtrg-start dtrg-level-0::after {
 text-align: center;
}

zgoforth

Update, I tried my suggestion, and it didn't work

I implemented td { font-size: 12px; text-align: center;} into my CSS and tried to override with,

"columnDefs" : [{
                "targets": 0,
                "className": "text-left",
            }],

and this still centers the text in the group,

zgoforth

I wish I could mark this as answered, I just fixed it.

td { font-size: 12px; text-align: center;} Inserted this into my CSS

Then in then end of my startRender function, I applied style="text-align: left;" to

 return $('<tr/>').addClass(statusClass)
                        .append('<td colspan="8" style="text-align: left;">' + group + ' (' + rows.count() + ')</td>')
                        .attr('data-name', all)
                        .toggleClass('collapsed', collapsed);