Javascript 内容脚本样式表泄漏到页面中

我正在做一个分机。用户双击页面上的某个术语，并通过侧面板弹出窗口获取数据。
我得到的数据被格式化并存储在一个名为innerDiv的div中，其类innerDiv是附加到主体中的div的子类。
js部分工作正常，但该页面的css覆盖了我的css，并且扩展样式表泄漏到页面中。这是双向的

.inner-div{
  position: relative;
  overflow-y: auto;
  color: wheat;
  height: 90%;
  width: 100%;
  text-align: justify;
  font-size: 16px;
}

.inner-div p, h1, h2 , h3, article{
  margin-bottom: 10px;
  color: wheat;
  text-decoration: none;
  border: none;
}

正如你所看到的，我已经尽可能地保持了我的CSS。因此，具有不同类的dom的页面无法继承我的css

css泄漏到页面中的图片

dom元素和类的图片

我不明白为什么扩展css会泄漏到页面中。请帮忙

编辑：

根据建议将div名称更改为更具体的扩展内部div。问题依然存在

Manifest.json：

{
    "manifest_version" : 2,

    "name" : "QWiki",
    "description" : "", 
    "version" : "1.0",

    "browser_action" : {
      "default_popup" : "Wiki_Viewer.html",
      "default_title" : "QWiki"
    },

    "content_scripts" : [{
      "css": ["inject.css"],
      "matches": ["http://*/*" , "https://*/*"],
      "js" : ["jquery.min.js" , "inject.js"]
    }],

    "permissions" : [
      "activeTab",
      "https://en.wikipedia.org/*"
    ]
}   

顺便说一下，我遇到了这个问题，通过采纳这个建议并从

content\u脚本

中删除我的CSS文件，问题得到了解决

---

这可能会破坏一些扩展，因为您可能希望使用自定义CSS设置普通页面的样式。为了解决这个问题，我创建了两个CSS文件，

internal.CSS

和

external.CSS

。内部文件具有我的

popup.html

的所有样式，外部文件具有我实际上想要应用于扩展用户的DOM的CSS。最后，我在

content\u scripts

中只引用了

external.css

，尝试使选择器更加具体，比如

.my extension internal div

。它比较长，但不太可能与页面冲突。我可以这样做，但当类不同时为什么会冲突呢。它也只是一些网站，而不是全部。

.internal div

非常通用。很可能，这些网站也有一个

.internaldiv

。没有这些类的站点不会受到影响。所有css看起来都非常通用……特别是当你使用标记选择器时。如果你在manifest.json上的“content\u scripts”中列出了你的样式表，你能尝试删除它吗。我假设您的html页面是在后台运行的，这样您就不需要在content_脚本中添加样式表，这样您就不会有样式泄漏的prb