Pinned Cells CSS Treatment

[mpelantParticipant]

I’ve got a jqGrid with three pinned cells on the left. I want to make the right hand border on the last pinned cell darker or thicker than the other cells to visually show where the pinning ends.

I’ve tried:

.jqx-grid-cell-pinned:last-child {
border-right: 2px solid #CCCCCC;
}

Doing just:
.jqx-grid-cell-pinned {
border-right: 2px solid #CCCCCC !important;
}

does apply the formatting but to every pinned column.

Any work around for this?

[DimitarParticipant]

Hello mpelant,

Here is how you can achieve this requirement by using the cellsrenderer callback function: https://www.jseditor.io/?key=jqxgrid-pinned-column-style. We hope this solution is helpful to you.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[mpelantParticipant]

Thanks Dimitar,

That should work just fine. Out of curiosity, is there a reason the CSS .jqx-grid-cell-pinned:last-child doesn’t work?

Thanks,

Mike

[DimitarParticipant]

Hello Mike,

The :last-child selector matches every element that is the last child of its parent, but the pinned cells are not the last children of their respective rows (there are cells after them that are not pinned). You can observe this with your browser’s DOM explorer (developer tools).

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts