[DUP] Misaligned grid columns with header labels when no scroll bar is visible

Grid Panel Columns are not aligned to header when there is no verticals scroll bar visible.

If scroll bar is visible, header label and data columns are aligns.

I observed that if data is loaded from ajax and from model, this behavior happens, if I used data available from array, this wont happen. Sample data I used is from the help page with the "simpsons" data.

I also noticed in one of your online example, this behavior was also happening.

http://ift.tt/SxtsgU

I attached a screen shot below as well as codes I used.

sencha.jpg

Code below...

HTML Code:

Ext.define('WoModel', {
    extend: 'Ext.data.Model',
    fields: [ 'id', 'name', 'email', 'contact' ]
});


var woStore = Ext.create('Ext.data.Store', {
    model: 'WoModel',
    proxy: {
        type: 'ajax',
        url: '../../GetInfo',
        actionMethods: {
            read: 'POST'
        },
        reader: {
            type: 'json',
            rootProperty: 'infos',
            totalProperty: 'total',
            idProperty: 'ids'

        }
    }
});



Ext.onReady(function(){


    var viewport = new Ext.Viewport({
        layout: 'border',
        frame: false,
        border: false,
        items:[{
                region: 'north',
                xtype: 'component',
                height: 73,
                el: 'pageHeader'
            }, new Ext.Panel({
                region: 'center',
                layout: 'border',
                frame: false,
                border: false,
                items: [ new Ext.TabPanel({
                    region: 'center',
                    deferredRender: false,
                    layOutOnTabChange: true,
                    activeTab: 0,
                    frame: false,
                    border: true,
                    html: "test"
                }), {
                    region: 'west',
                    xtype: 'grid',
                    layout: 'fit',
                    width: 580,
                    title: 'Simpsons',
                    store: woStore,
                    columns: [
                        { text: 'Name', width: 50,  dataIndex: 'name' },
                        { text: 'Email', dataIndex: 'email', flex: 1},
                        { text: 'Phone', width: 100, dataIndex: 'phone' }
                    ],

                    stripeRows: true,

                    columnLines: true,

                    forceFit: true,

                    loadMask: true,

                    stateful: true,

                    stateId: 'grid'

                }

                ]

            })]
    });
    woStore.load({params:{start:0, limit:26}});

});