応答画面でdivを非表示にする

CSSを使ってfacebookのようなボックスを非表示にしたい。私はこれを使用：応答画面でdivを非表示にする

.fb-like-iframe.fb_iframe_widget { 
    display: none !important; 
}

をしかし、これだけ大きなディスプレイのためではなく、作品と、それはまだ携帯に見せています。

ウェブページのサイズをデスクトップ上で小さくし、幅を小さくすると、応答が変わるティップポイントとfb-like-iframeが表示されます。

私も携帯電話でそれを隠すために、これを使用してみましたが、何の成功は遠くない：

/* Smartphones (portrait and landscape) ----------- */ 
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) { 
    .fb-like-iframe.fb_iframe_widget { 
     display: none !important; 
    } 
}

出典

2017-05-08 Lucian Barligea

これがどこにあるのかを見ることができます。つまり、コードがある場所にURLを投稿してください。私の直感は、このウィジェットを囲むdivに配置し、ビューポート幅のメディアクエリに応じてそのdivを表示または非表示にすることです。 –

リンク先は次のとおりです。http://www.quizuri.ro/quizzes/cate-patrate-sunt-in-imagine/1026?embed=trueスタートをクリックして任意の回答を選択します。その後、モーダルがポップするのを数秒待ちます。 –

代わりのmin-device-widthとmax-device-widthあなたがmin-widthとmax-widthを使用することができます。あなたは、この使用している

現在

/* Smartphones (portrait and landscape) ----------- */ 
@media only screen (max-width : 480px) { 
    .fb-like-iframe.fb_iframe_widget { 
    display: none !important; 
    } 
}

出典

2017-05-08 06:02:55

@Abhishek Pandey、はい私はあなたに同意しますが、OPは彼の要件に従って最大幅を定義することができます。私はちょうど彼が何を間違っていたか教えてください –

私もそれを試して、それは動作しません。ここにリンクがあります：quizuri.ro/quizzes/cate-patrate-sunt-in-imagine/1026?embed=t rueちょうど開始をクリックし、任意の答えを選択してください。その後、モーダルがポップするのを数秒待ちます。 –

それとも、より良い結果をあなたは...だけmax-width使用することができます。ちょうど(max-width: 768px)に(min-width: 768px)を変更

@media screen and (min-width: 768px) 
.fb-like-iframe.fb_iframe_widget { 
    display: none !important; 
}

を、これは何が必要であればは私に知らせて

出典

2017-05-08 06:32:44

私もそれを試しました、運はありません。あなたはここに見ることができます：http://www.quizuri.ro/quizzes/cate-patrate-sunt-in-imagine/1026?embed=true –

あなたはあなたが隠そうとしている正確なものをスクリーンショットできますか？ –

はスクリーンショットですhttp://i.imgur.com/IoWiSBT.png（携帯）http://i.imgur.com/EirOWHe.png（デスクトップ）私はまた、デスクトップからモバイルへhttps://www.youtube.com/watch?v=NpUONG6MGfE –

style.cssとモバイル上でのみ動作しない原因となっていた縮小版との競合がありました。

.fb-like-iframe.fb_iframe_widget { 
 
    display: none !important; 
 
}

私はそれを修正した、今、元のコードは、（上記）は、デスクトップとモバイルの両方で動作します。ありがとう

出典

2017-05-08 11:46:57

応答画面でdivを非表示にする

答えて

関連する問題