CSS 冲突 - ExtJs 网格中的位置：绝对

Question

最近，我将 ExtJs Grid 集成到现有网页中，导致 CSS 冲突。我已经在现有样式表中发现了冲突的 CSS。不幸的是，我无法修改当前的样式表，因为整个网站都是建立在其之上的。

我尝试过使用ctCls、baseCls、bodyCfg、bwrapCssClass和bodyCssClass，但没有达到预期的效果。

下面是我现有网站的冲突样式表，

div
{
font-weight: bold;
font-size: 12px;
visibility: visible;
font-family: Arial, sans-serif;
white-space: nowrap;
position: absolute;
}

样式 position:absolute 导致了冲突。我尝试过 CSS 覆盖，但没有按预期工作。

请注意： 为渲染网格中的每个 DIV 标记设置样式 position:relative 可以解决此问题。我已经使用 IE 开发工具栏模拟了它。

有人可以帮助我如何为渲染的网格进行设置，以便我可以使用 position:relative 成功覆盖母版页 CSS 样式的 position:absolute 。

有人遇到过类似的问题吗？我可以成功覆盖 CSS 吗？ 任何帮助将不胜感激。

谢谢

Answer 1

我认为，在页面上的所有

元素上以如此通用的方式设置 CSS 样式不是一个好主意。但是好吧...您可以尝试使用以下 CSS 规则覆盖设置：

.x-grid3,
.x-grid3 div {
    font-weight: normal;
    position: static;
}

Answer 2

我的网络项目遇到了同样的问题，我已经搜索了很长时间才能找到解决方案。问题是两个元素在同一个框架中使用相同的CSS。因此，避免冲突的最佳方法是将网格面板渲染到另一个框架中（始终在同一页面中）。您可以使用 托管 IFrame用户附加信息或uxmedia。我正在使用 uxmedia 扩展。要在 uxmedia 中创建 iFrame：

var htmlViewer = new Ext.ux.ManagedIFrame.Panel({  

    border  : false,

    title   : title,

    header: header,

    region:'center',

    iconCls : iconCls,

        // Here your Grid Panel comes within an url from server side
    defaultSrc : urlAddress
        });