When changing padding, the selection row goes crazy!

Tags: #<Tag:0x00007efc6ad25150> #<Tag:0x00007efc6ad24ea8>
#1

I set a certain padding to rows (in order to have the content more readable for the end user) but when clicking on any row, the highlight, selection and cursor on the grid go crazy:

I added this on the web page style:

.handsontable td, th {
padding: 8px !important;
}

Then I have added a class to highlight the row in the creation of the handsontable grid

currentRowClassName: ‘currentRow’,
currentColClassName: ‘currentCol’,

Then the css definition is here:

.handsontable .currentRow {
background: #FCE4EC
}

I just selected one row, and the handsontable highlights many rows.

image
image.png1046×489 38.3 KB

Please help.

#2

It usually happens when I scroll down where there’re no rows selected, then the first click on any row, the selection highlights many rows.

Scrolled to a position where there’s no selected rows:

image
image.png1007×483 37 KB

Then I click and It happens again:

image
image.png1006×474 38.4 KB

#3

Hi @dante.soto

We don’t recommend modifying core Handsontable styling as it may result in problems as yours. If you need to make cells wider and higher you can use options such as colWidths and rowHeights.

#4