Ext.Panel display error using custom css borders

Question

I have created a JSfiddle to let you show the issue... http://jsfiddle.net/mrgamer/u3Z48/

element.width of x-panel-body is incorrectly calculated, in the example above it's set on 340px, instead to CORRECTLY show the borders i've set should've been set to 338px!

Screenshots to clarify even more:

How it is:

How it should be:

I understand this is a really tiny 'issue', still i don't know how to correct it, it's annoying to have such display errors in a overused component like Ext.Panel.

Answer 1

To solve the problem is enough defining the width in the style config, like this:

var panel1 = new Ext.Panel({
    title: 'Inner Panel',
    height: 300,
    style: {width: '350px'},
    border: false,
    cls: 'panel_class',
    bodyCssClass: 'body_border'
});

It's not as clean as possible, but i think it's a decent solution to the ExtJS miscalculation!