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

问题描述：

最近我将ExtJs网格集成到一个现有的网页，并导致CSS冲突。我确定了现有样式表中存在冲突的CSS。不幸的是，我无法修改我当前的样式表，因为整个网站都是建立在此基础上的。CSS冲突 - 位置：绝对ExtJs网格

我已经使用ctCls，baseCls，bodyCfg，bwrapCssClass和bodyCssClass试过，但没有制定出符合市场预期。

下面是我现有的网站

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

风格位置冲突的样式表：绝对是导致冲突的。我试过CSS覆盖，但没有按预期工作。

请注意：设置样式位置：相对到渲染网格中的每个DIV标签都可以修复问题。我用模拟了IE开发工具栏。

有人可以帮助我，我该怎么设置，为渲染电网，这样我就可以成功地覆盖的位置是：绝对的母版页CSS样式的，与位置：相对。

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

感谢

是否有可能您提供了网格。所以我们可以尝试在萤火虫中看到它。 tnx – 2011-05-05 09:39:57

答

我不认为，这是对网页上的所有<div> -elements设置CSS样式在这样一种通用的方式是一个好主意。但是，OK ......你可以尝试使用覆盖以下CSS规则的设置：

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

没有！它不工作。我也尝试过其他几个CSS类。 CSS中有什么机制允许忽略特定的样式位置：绝对来自masterpage的样式表，而渲染？我已经尝试过！重要性，但没用。 :( – abhilashca 2011-05-05 08:54:33

该标志被称为'！important'，但您应该使用Firebug（或其他开发工具）来检查哪些样式应用于某个元素以及哪些样式已被覆盖。 – 2011-05-05 09:08:15

嗨，感谢修正（！重要）。我设法通过在ext-all css文件中添加样式来覆盖css。 'code'div {position：relative;}'code' 但是这只是固定网格的位置问题，但已经导致了一些font-family和font大小的问题，因为我的DIV的maste风格定义了这些样式。暂时没问题。但是，我正在寻找一种更好的解决方案。谢谢您的帮助：） – abhilashca 2011-05-05 10:57:03

答

我与我的web项目同样的问题，我已经搜查很长时间才能找到解决方案。问题是两个元素在相同的帧中使用相同的Css。因此，避免冲突的最好方法是将Grid Panel渲染到另一个框架中（始终放入同一页面）。您可以使用Managed IFrame user extension或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 
     });

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

相关推荐