Search code examples
handsontable

Odd blue borders in handsontable

I have a very basic handsontable in my component in React.

<HotTable
    settings={{ licenseKey: 'non-commercial-and-evaluation' }}
    data={this.state.rawData}
    colHeaders={false}
    rowHeaders={false}
    readOnly={true}
    width="600"
    height="300"
/>

When I click on the top left cell, i see very odd blue borders as follows. We could see that it is related to wtBorder.

enter image description here

Does anyone know what's wrong here? I tried to create a codesandbox, but in the snippet I could not reproduce the problem.

PS: additionally, there is a textbox generated at the bottom of the page, when we write text inside, it impacts cell values. It is strange as well.

Solution

  • It seems that you haven't imported the Handsontable CSS stylesheet and the only styles applied to your DOM are some inline styles that Handsontable adds.