Skip to Content
avatar image
Former Member

How to highlight specific data cell columns

Hello,

Is it possible to select a specific column in the Cross Tab component, in the data cell area using CSS?

If so, please let me know how this can be achieved without using conditional formatting from BEx.

Thanks,

Hanks

Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

4 Answers

  • Best Answer
    avatar image
    Former Member
    Dec 20, 2016 at 08:04 PM

    Thank you Vidhya, that was helpful to get a step closer.

    By removing the div:after, the final code used to highlight a data cell column is:

    .myCrossTab .sapzencrosstab-DataArea td:nth-child(1).sapzencrosstab-DataCellDefault {
    background: rgba(0,0,0,0.5)!important; 
    }

    Now to take this a little further... Is it possible to apply two CSS classes to one crosstab?

    EXAMPLE:

    I need to highlight two columns dynamically, can I do something like?

    .myCrossTab .col1 .sapzencrosstab-DataArea td:nth-child(1).sapzencrosstab-DataCellDefault {
    background: rgba(0,0,0,0.5)!important; } .myCrossTab .col2 .sapzencrosstab-DataArea td:nth-child(1).sapzencrosstab-DataCellDefault { background: rgba(0,0,0,0.5)!important; }

    and how can I call this in the script?

    Thanks,

    Hanks

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Found the solution:

      define it as .myCrossTab.col1{} and .myCrossTab.col2{}

      to call it, use scripting to set CSS as "myCrossTab col1" and "myCrossTab col2"

  • Dec 20, 2016 at 07:26 AM

    Hi,

    Please see below blog for requirement,

    https://blogs.sap.com/2016/12/08/format-your-own-symbol-in-the-crosstab-using-css-sap-design-studio-1.6/

    And also here the CSS code for check the particular column in crosstab,

    sapzencrosstab-DataArea td:nth-child(5).sapzencrosstab-DataCellDefault div::after {
    
    content: ” %”;
    
    }

    Regards,

    Vidhya.C

    Add comment
    10|10000 characters needed characters exceeded

  • Dec 19, 2016 at 05:30 PM

    Hi - please see Venu's blog of CSS https://blogs.sap.com/2015/04/22/list-of-css-for-sap-design-studio/ to give you some ideas

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Thanks Tammy but I need to be more specific than ".sapzencrosstab-DataCellContentDiv" as I am trying to highlight a column within the DataCells

  • Dec 19, 2016 at 07:14 PM

    Please see Eshwar's reply here: https://archive.sap.com/discussions/thread/3876503

    Add comment
    10|10000 characters needed characters exceeded

    • Former Member

      Thanks Tammy, however Eshwar is changing the entire datacell area to another color.

      I am looking to change the color of a specific Column within the Data cell.