javascript - 由于 CSS，Codemirror 显示不正确

Question

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

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

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

一个可能的解决方案是创建一个名为 not-codemirror 的 class 并将其应用于我网站上的每个元素，但 Codemirror 的元素除外。这对我来说似乎有点矫枉过正，尤其是考虑到大多数页面不会使用 Codemirror。所有页面共享同一个 CSS 文件。

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

编辑

我现在将它显示为:

它应该是这样的:

我补充说:

display: inline;
margin: 0;
padding: 0;

到 codemirror.css 中的 .CodeMirror span。

Answer 1

Codemirror 标记有一个特定的类 .CodeMirror(至少在最新版本中它存在)；

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

clashing-selector:not(.CodeMirror)