Question

遇到了一个我以前从未说过的问题。

我有一个元素，它是一个固定在屏幕右侧的面板，用于定位的CSS是：

.myPanel{
    position:absolute;
    left:0;
}

这很好用，面板的标记是由vaadin生成的。

现在一切正常，但是当我刷新页面css position:absolute时被忽略了。

当然，我打开我的devtools并看到根据样式选项卡position:absolute IS 正在应用，它看起来不像。

现在奇数位

当我取消选中复选框以删除position:absolute样式时，没有任何更改（正如我所期望的那样），但当我重新检查它并重新应用position:absolute时，面板会正确显示

所以即使没有新的css，删除然后重新添加position:absolute也会修复它。

我一直认为动态添加的元素仍将采用已加载pior的css样式。这是不正确的吗？

我只使用chrome，目前版本为39

有什么想法吗？

更新：

如果在某些时候css被覆盖，我希望开发工具标记（具有删除线等的风格），但不是。我尝试过添加！重要但得到完全相同的结果（请参阅devtool中的应用，禁用并重新启用修复它）。

我在dom中注意到vaadin在头部加载我的自定义javascript，然后是css，然后是它自己内置的javascript。

Answer 1

它是一个已知的错误，看起来已经解决并再次出现，另请参阅https://code.google.com/p/chromium/issues/detail?id=313221

Answer 2

这似乎符合规范。如果宽度和高度   对于替换元素（哪个输入是一个）是自动的，它应该是   使用可能导致的元素内在宽度和高度   绝对定位过度约束。

一个修复是将输入包装在div中，绝对定位，和   在输入上使用宽度/高度100％。请注意，Firefox也有这个   行为，它确实在规范中，所以最好修复   网站比改变Chromium。   〜#9 chromo...@gmail.com

按照你的说法：

我在dom中注意到vaadin正在加载我的自定义javascript 头部，然后是css，然后是它自己内置的javascript。

我会说所有浏览器就是这种情况。有关详细信息，请参阅与此相关的previous answer of mine

CSS未应用于元素

2 个答案: