css - Ext.Panel 使用自定义 CSS 边框显示错误

Question

我创建了一个 JSfiddle 来让您展示问题... http://jsfiddle.net/mrgamer/u3Z48/

x-panel-body的element.width计算不正确，在上面的示例中，它设置为 340 像素，而不是正确显示我设置的边框应该设置为 338 像素！

截图更清楚：

它是怎样的：

应该如何：

我知道这是一个非常小的“问题”，但我仍然不知道如何纠正它，在 Ext.Panel 等过度使用的组件中出现这样的显示错误很烦人。

Answer 1

尝试以下

.x-panel-body .body_border{
    padding: 2px;
    border: 1px solid red;
    margin: 1px;
}​

Answer 2

要解决这个问题，在样式配置中定义宽度就足够了，如下所示：

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

它不是尽可能干净，但我认为这是 ExtJS 误算的一个不错的解决方案！