Skip to Content

How to remove(not display at all) the header row of a cross tab using CSS in SAP design studio?

We are developing a dashboard using SAP Design Studio, where in we need to have a cross tab without header row. Used the following code and made the header invisible.

.sapzencrosstab-DimensionHeaderArea, .sapzencrosstab-ColumnHeaderArea

{ visibility: hidden; }

But it still shows a blank area as the top row as shown in the attachment below.

In order to remove this, we tried to find the CSS class associated with this area of cross tab using right-click+inspect element from the display screen and then selecting the header area of the cross tab. This showed the HTML code for the selected area of crosstab highlighted. But we could not find a CSS class associated with this specific area of cross tab. But on the right side window showing the CSS details, we added a new style attribute 'display:none' and the whole header disppeared as shown in the second picture of the attachment.

cssstylechg.png

Now the question we have is, is there a way to make this change to the style attribute permanent.

cssstylechg.png (210.5 kB)
Add comment
10|10000 characters needed characters exceeded

  • Get RSS Feed

3 Answers

  • Nov 29, 2016 at 10:15 AM

    I have the same question and really eager to knwo the answer; If you - in the meantime - would find and answer, please share here Sreedevi

    Add comment
    10|10000 characters needed characters exceeded

  • Nov 29, 2016 at 10:26 AM

    Please see this thread and see if it helps: https://archive.sap.com/discussions/thread/3651119

    Add comment
    10|10000 characters needed characters exceeded

  • Jan 27, 2017 at 12:22 PM

    See this thread: https://archive.sap.com/discussions/thread/3844080

    this works for me

    .myCrosstabHiddenHeader .sapzencrosstab-DimensionHeaderArea,

    .myCrosstabHiddenHeader .sapzencrosstab-ColumnHeaderArea {

    visibility: collapse;

    }

    Add comment
    10|10000 characters needed characters exceeded