Skip to Content

Crosstab - Rows Coloring

Hi,

I have requirement to give different rows coloring for the cross tab as described below.

Row 1 Red

Row 2 Yellow

Row 3 Green

Row 4 Blue

Currently I used this CSS code

.Crosstab1 .sapzencrosstab-DataArea tr:nth-child(1) {
   background: red !important;   
} 
.Crosstab1 .sapzencrosstab-DataArea tr:nth-child(2) {
   background: yellow !important;   
} 
.Crosstab1 .sapzencrosstab-DataArea tr:nth-child(3) {
   background: green !important;   
} 
.Crosstab1 .sapzencrosstab-DataArea tr:nth-child(4) {
   background: blue !important;   
}

Unfortunately, somehow there is a CSS line from library.css prevents me from doing this.

.sapzencrosstab-DataCellAlternating, .sapzencrosstab-RowHeaderArea .sapzencrosstab-HeaderCellAlternating{ 
background-color: #f5f7f9
}

If I uncheck this CSS line code on the F12 Developer tools, then my code is working fine.

How do I get around of this issue?

Thank you in advance.

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

1 Answer

  • Best Answer
    Oct 05, 2017 at 04:50 AM

    Hi Donnie,

    Your CSS works if you set the Crosstab Alternating Row Style property to "Off" as shown below:

    Regards,

    Mustafa.

    Add comment
    10|10000 characters needed characters exceeded