Telerik UI 干扰了它自己的风格

Telerik UI interfering with its own styles

因此,在我当前的项目中,过去几周我们 运行 遇到了一个特别有害的问题:Telerik RadWindow 样式不再正确呈现。边框周围似乎有一些额外的 space,window 图标齐平地位于左上角,标题栏按钮存在,但它们的图标是不可见的。我们在使用 RadAlert 和 RadWindow 时遇到了完全相同的问题。我的队友也在使用 Firefox 和 IE,他们也遇到了完全相同的问题。

但是:并不是所有页面都出现这个问题。 RadWindows 在给定页面上的外观是否正常对于该页面始终是一致的。早些时候我注意到 window 正确显示的地方,Chrome 每次都在下载一个新的样式表,尽管禁用缓存并没有改变任何东西。

我注意到用于 buggy 样式表的 URL 与普通样式表不同。我分解了查询字符串进行比较,_TSM_CombinedScripts_ 参数给出了不同的 public 键标记。其实一开始是一样的,到最后就完全不一样了

normal:

d=d_7ijIXc06Eqg7xyrMT_AE_WxZL3XaVJz_VwsvOdK_1ssgHIAGoqaJzPVn-aFQFJVakZqv0a6M6IUW8lKaDBl-g9FohhCb-0KC2Mu14d6L4y47PrZb-wQiVUGqaxwCy7qcc2Dw2
t=635823632443834005
compress=1
_TSM_CombinedScripts_=
    ;;Telerik.Web.UI, Version=2014.3.1209.45, Culture=neutral, PublicKeyToken=121fae78165ba3d4:en-US:cd668efa-682a-4e93-b784-26f0724f247c:92753c09:ed2942d4:580b2269:8cee9284:a3b7d93f:9e1572d6:aac1aeb7:1c2121e:4d471440:c86a4a06:45085116
    ;Telerik.Web.UI.Skins, Version=2014.3.1209.45, Culture=neutral, PublicKeyToken=121fae78165ba3d4:en-US:a1fec5ec-d336-48a8-850e-06eaadf10400:62641802:f82ffad1:9db7724d:fa319bc5:226a649d:51352d27:8b77daa8:976fe3c:f144572

buggy:

d=d_7ijIXc06Eqg7xyrMT_AE_WxZL3XaVJz_VwsvOdK_1ssgHIAGoqaJzPVn-aFQFJVakZqv0a6M6IUW8lKaDBl-g9FohhCb-0KC2Mu14d6L4y47PrZb-wQiVUGqaxwCy7qcc2Dw2
t=635823632443834005
compress=1
_TSM_CombinedScripts_=
    ;;Telerik.Web.UI, Version=2014.3.1209.45, Culture=neutral, PublicKeyToken=121fae78165ba3d4:en-US:cd668efa-682a-4e93-b784-26f0724f247c:92753c09:ed2942d4:580b2269:1c2121e:9e1572d6:45085116
    ;Telerik.Web.UI.Skins, Version=2014.3.1209.45, Culture=neutral, PublicKeyToken=121fae78165ba3d4:en-US:a1fec5ec-d336-48a8-850e-06eaadf10400:62641802:f82ffad1:9db7724d:8b77daa8:226a649d

至于真正的错误,我做了一些检查,我发现样式表实际上覆盖了它自己的样式。我 运行 Telerik.UI.Webresource.axd 通过格式化程序返回的样式表,第 216 行定义了一些规则:

.RadWindow .rwCloseButton {
    background-position: -90px 0
}

.RadWindow .rwCloseButton:hover {
    background-position: -90px -21px
}

然后在第 4634 行覆盖它们。 buggy 样式表总共有大约 2600 行额外的行。非常棒运行这些新规则也将常规关闭按钮样式应用于非活动状态下的悬停关闭按钮windows。

.RadWindow .rwCloseButton,
.RadWindow.rwInactiveWindow .rwCloseButton:hover {
    background-position: -1px -762px
}

.RadWindow .rwCloseButton:hover {
    background-position: -21px -762px
}

在 windows 正确显示的页面上,仅应用前两条规则,第二组规则永远不会出现 运行ce。我只是不明白它是如何将样式组合在一起的,或者为什么它会覆盖自己。

据我所知,none 的参考资料已更改。没有任何升级,web.config 没有改变。我们在本地环境和开发箱中都遇到了同样的问题。

从所有 RadWindows 中删除 RenderMode="Lightweight" 或确保所有 RadWindows 都有它可以解决问题。

原来问题是我们的一位团队成员在几个页面上添加了一些带有 RenderMode="Lightweight" 的 RadWindows。据推测,加载的第二个样式表实际上是针对轻量级模式的。这就是文档告诉您不要混合渲染模式的原因。