コンテンツスクリプトのスタイルシートがページにリークする

Question

私は拡張機能を開発中です。ユーザーは、ページ上のいくつかの用語をダブルクリックし、サイドパネルのポップアップを介してデータを取得します。
私が取得したデータはbodyに追加されたdivの子であるinner-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の

絵。助けてください！

EDIT：

は提案に応じて拡張・インナーの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/*" 
    ] 
} 

Answer 1

だけBeslinda N's commentをバンプするために、私はこの問題を持っていたし、それはその助言を取り、content_scriptsから私のCSSファイルを削除することで解決しました。

これは、通常のページをカスタムCSSでスタイルしたい場合があるため、一部の拡張機能が壊れる可能性があります。この問題を解決するために、2つのCSSファイルinternal.cssとexternal.cssを作成しました。内部ファイルには私のpopup.htmlのすべてのスタイリングがありました。外部にはCSSがありました。実際には拡張ユーザーのDOMに適用したかったのです。最後に、content_scriptsにはexternal.cssしか参照しませんでした。