我有一个动态创建的页面，其中包含以下内容的面板：
<div class="x-panel-body x-panel-body-default x-panel-body-default" id="panel-1026-body" style="left: 0px; top: 0px; width: 1819px; height: 29px;">
我想更改此面板的宽度，但问题是宽度没有被覆盖。
我在css中尝试做的是：
#panel-1026-body {
width: 400px;
}
这不起作用，因为面板自动创建宽度仍然保持1819像素。然而，似乎它只是宽度：它不会接受，如果我是fx。添加margin-left: 400px;或background-color: red;即可。
有谁知道宽度没有生效的原因是什么？ 我提供了我认为相关的信息，但如果您需要更多信息，请告诉我
谢谢
答案 0 :(得分：2)
这是因为当您在元素中设置值style="left: 0px; top: 0px; width: 1819px; height: 29px;"时，它将优先于CSS。
#panel-1026-body {
width: 400px !important;
}
但使用!important
尝试删除元素的所有样式并将其放入CSS类中。之后，把你的CSS代码放在代码之前。
答案 1 :(得分：1)
内联样式的specificity更大，所以通常你不能覆盖它。你需要使用！important：
#panel-1026-body {
width: 400px !important;
}
是边缘左边或背景颜色，因为这些没有以内联样式定义。
答案 2 :(得分：1)
使用CSS更改复杂的组件尺寸（面板，网格，树等）在Ext中通常不是一个好主意。您在DOM中看到的维度，在您的情况下为1819px，也可以根据布局在面板的某些子项上设置。
因此，您需要使用css来解决主容器div和所有必需的子节点。这样的解决方案非常容易受到攻击，因为DOM结构可以（并且确实）随着Ext升级而改变 - 有时即使是轻微的升级也可能会引入DOM的变化。
您应始终以编程方式设置维度panel.setWidth()，panel.setHeight()，panel.setSize()或类似内容。然后Ext关注自己并将宽度设置为它需要的所有DOM元素。
答案 3 :(得分：0)
正如本主题中提到的所有建议，解决方案是添加：
width: 400px !important;
这解决了我的问题。感谢所有帮助的人