由于CSS，Codemirror显示不正确

Question

我的CSS代码导致Codemirror显示不正确。见下文：

如何防止我的样式影响Codemirror创建的元素，以便Codemirror能够正确显示？

即使我设法调整我的CSS代码以便我的页面和Codemirror都能正确显示，但将来这将是一场噩梦，因为任何未来的样式都可能影响Codemirror。此外，我的CSS文件是根据客户端给出的值动态生成的，这进一步使事情变得复杂。

一种可能的解决方案是创建一个名为class的{​​{1}}并将其应用于我站点上的每个元素，而不是Codemirror的元素。这对我来说似乎有些过分，特别是考虑到大多数页面都不会使用Codemirror。所有页面共享相同的CSS文件。

另外，如果可能的话，我更喜欢非jQuery解决方案。感谢

修改

我现在将它显示为：

它应该是这样的：

我补充说：

not-codemirror

到display: inline; margin: 0; padding: 0; 中的.CodeMirror span。

Answer 1

Codemirror标记具有特定的类.CodeMirror（至少在最新版本中存在）;

因此，如果您希望其他样式不发生冲突，可以使用.not：

clashing-selector:not(.CodeMirror)

Answer 2

你知道问题在于CSS声明的冲突，所以我建议给你的每一个或Codemirror的标签与class冲突，以消除混淆。很明显Codemirror应该是你改变的那个，因为它听起来好像你的网站的动态CSS受到了很好的约束。这个“有针对性”的解决方案比使用not-codemirror标记攻击您的整个网站要简单得多（幸运的是，不涉及任何jQuery），我认为要弄清楚要改变的内容并不困难。 Codemirror的源代码，如果您对自己的CSS比较熟悉。

如果事实证明你遇到了具有特异性的问题，你可以证明使用!important标签是合理的，但我会试着在原则上远离它。