Ext grid adds undesired horizontal scroll when I add cell border

Question

I need to add cell borders to my ExtJS grid, here is what I did: I added this to the grid:

viewConfig:
    {
        stripeRows: false,
        getRowClass : function(record, index) {  
            return "grid-row" 
        }
    },

And then I included this css style:

.grid-row td{
    line-height:22px;
    font-size: 13px;
    border: solid gray 1px;
}

My border works fine, but then my grid shows the horizontal scroll.

Is there any other solution for add borders to the cells, of for get rid of the scroll?

Thanks.

Which ExtJS version are you using? I cannot reproduce your problem in ExtJS 4.2.1 and ExtJS 6.0.2. — Alexander

Roberto Rodriguez Roberto Rodriguez · Accepted Answer · 2016-06-29T19:02:29

The problem was I was using flex for set the width of my 5 columns. As work around: I switched to use default width:'20%', then in one of the columns I set width:'19.9%'. It works fine now. Thanks.

Ext grid adds undesired horizontal scroll when I add cell border

1 Answers