Unable to set column header border width

Tags: #<Tag:0x00007efc6505b910>

We want to set specific width to column border but currently it seems that it is not possible although we are able to apply the custom colors to the border
Ref screenshot : https://imgur.com/akNpiZd

Hi @aayushdehariya

What about box-shadow / inset? Here’s an example https://jsfiddle.net/o4b29uhq/
When it comes to borders a cell in Handsontable only has a bottom and right border so border styling is not easy.

HI @aleksandra_budnik thanks for the reply. this works for a single cell, can you guide us how can we set border and its width for entire column?

In the example the box-shadow is added to each column

49

can you mark it red (or anything else) which cells/header you would like to have with the box-shadow?

for example i need whole car column including header to have box shadow

OK, So here’s an example https://jsfiddle.net/594g1bdu/

I am using the same className for the :first-child element of .handsontable TH and attaching it via custom cell renderer to the cell in that column.

Hi @aleksandra_budnik I tried your solution form last fiddle
but for my requirement i need to set border color and width to whole column
not specific cell
Example - https://imgur.com/jZCxoIi
Please help me with the same

You can try to set up

  • border-top, border-left and border-right for the header
  • border-bottom, border-left and border-right for the last cell
  • border-left and border-right for the rest of cells

but I do not have a demo for that.

Hi @aleksandra_budnik
Thanks for the solution it works great
although i am not able to apply the css to the last cell if you could help me with that that would be really helpful
Ref : https://imgur.com/a/yM7v2xN

Here are the setting for the cells http://jsfiddle.net/ovz9t4w1/1/

Hi @aleksandra_budnik
thank you so much for the response I tried it but it doesn’t work can you please check once
Ref: https://imgur.com/Aj36THx

Did you can the render() after that setCellMeta()? I think it’d be better to work on demos - images help to see the outcome but they will not help me to replicate the issue.