このメディアクエリを特定のIDと組み合わせるには

Question

私はワードプレスサイトに100％幅のiframeを既存のメディアクエリで表示しようとしていますが、iframe IDをターゲットにできるかどうかを判断しようとしています元のメディアクエリの影響を受けないか、ユニークなメディアクエリと組み合わせてiframeだけでフルフレーム効果を得ることができます。

だけIDタグと私はこのように感じる#frame

@media only screen and (max-width: 767px) { 
    .responsive #top #wrap_all .container { 
     width: 100%!important; 
     max-width: 100%!important; 
    } 
} 

が完了から数秒で、これは元のコード

@media only screen and (max-width: 767px) { 
    .responsive #top #wrap_all .container { 
     width: 85%; 
     max-width: 85%; 
    } 
} 

であり、これは、私はそれが機能するために必要な方法です、しかし、私はそれをどのように終了するか分からない。

Answer 1

あなたの質問はあまり明確ではありません。独自のiframe IDが#frameであればその後、あなたはそれをターゲットにすることができます：

@media only screen and (max-width: 767px) { 
    /* your iframe */ 
    .responsive #frame { 
     width: 100%!important; 
     max-width: 100%!important; 
    } 
} 

あなたはより多くのルールを追加することができますし、あなたもこのメディアクエリー内の他のセレクタをターゲットにすることができます...

Answer 2

あなたは、最後に}を逃しました同様にあなたは同じ性質を持っている#frame要素を望んでいた場合、あなたの現在のコードは次のようになりますので、あなたは、この操作を行うことができるようにあなたは、CSSの宣言に複数の要素にタグを付けることができますよう： -

@media only screen and (max-width: 767px) { 
    .responsive #top #wrap_all .container { 
    width: 100%!important; 
    max-width: 100%!important; 
    } 
} // <-- Notice the ending bracket that you missed off, I added that. 

nはあなたがそうのような,と別の要素にタグを付けることができます： -

私はこのことを知っている

@media only screen and (max-width: 767px) { 
    .responsive #top #wrap_all .container, #iframe { // <-- see the , and the element? 
    width: 100%!important; 
    max-width: 100%!important; 
    } 
} // <-- Notice the ending bracket that you missed off, I added that. 

が長いったらしいですが、私は深さに行くだけではなく、あなたが完全に理解して、あなたに例を挙げてみました、私は助けを願って:)