Table rows misalignment when rendering large reports

[Radu Cantor]

When rendering large reports two issues happen (see attached images)

1. The row lines between the dimensions on the rows and the rest of the table are not aligned.
2. The row span for the first dimension on the rows, does not work.
3. When the row span is working, the first row is partially cut.

‌

‌

[Ulas]

In addition to this, when hierarchy and drill down/up are used row span messes the hierarchy and alignment.

[Ada Trajer]

Unfortunately we are not able to provide a fix for the issue that was caused by custom CSS.

[Radu Cantor]

This is not fixed. In the version 2021.07.01 we face the same problem on a different project

[Radu Cantor]

You can see the mis-alignment between row headers and the data rows.

I’m sending you the styles that we are using. The formatting is done based on attributes.

‌

[srichardson]

• Setting an !important height on any row that has a border width greater than 1px should solve your row misalignment issue.
• Disabling “Fixed Row Headers” should also solve this issue, however you will no longer have any fixed row headers.

.radu-row-highlight {
  font-size: 10.5px;
  font-style: italic;
  background-color: #fbf4df !important;
  border-style: solid none solid none !important;
  border-width: 3px !important;
  border-color: #e8c767 !important;
  height: 23px !important;
}

‌

[Radu Cantor]

Hi Stuart,

I tried setting the border-width as important, but this didn’t help. You can see in the pictures I posted earlier, that I already have “!important” for the border-width and the border-style.

Disabling the fixedRowsHeaders fixes the issue, but then the customer won’t see the name of the account when scrolling to the right.

‌

[srichardson]

Hi Radu,

Not border-width, height.
You could always try setting the height to auto aswell.

‌

height: auto !important

‌

[Radu Cantor]

Hi Stuart,

Setting the height in the CSS fixes the problem.

Thanks a lot for your help!

I will mark this issue as resolved.