モバイルGmailのアプリでメディアクエリが機能しない

Gmailアプリ用に1つのhtmlテンプレートを作成しています。私は、デスクトップビューで60％、モバイルGmailのAppビューで100％になるはずのイメージを1つ追加しました。私はそれを100％製のメディアクエリーでモバイルGmailのアプリでメディアクエリが機能しない

<div> 
    <img src="show.jpg" alt="Show your skills" class="mob-img" border="0" 
    style="outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; 
    width:60%;" /> 
</div>

：

これはimgタグの幅の60％です。しかし、それはGmailのアプリケーションで動作していません。

@media only screen and (max-width: 600px) { 
     .mob-img { 
     width: 100% !important; 
     } 
    }

Gmailのアプリケーションでこれが動作しない理由がわかりません。私が何かを見逃している場合は、私に知らせてください。事前

出典

2017-04-04 Anshul Jain

で

おかげで、あなたのHTMLヘッダー

<meta name="viewport" content="width=device-width, initial-scale=1.0">

出典

2017-04-04 06:10:54

を働いて、このいずれかを試すことができ、物事私が既に持っています私のHTMLにこれを加えましたが、うまくいきません。 –

"画面のみ"を "画面"に変更 –

は画面だけをscrennに変更しても動作しません.Gmailモバイルアプリでのみ問題が発生していますが、他の場所では問題なく動作しています。 –

のメタを追加<meta name="viewport" content="width=device-width, initial-scale=1.0">

メディアクエリを追加し、私あなたはそれがうまくhttps://jsfiddle.net/oa5bco0s/

出典

2017-04-04 06:35:59

返信ありがとうございます。これはgmailモバイルアプリでは機能しません。 –

モバイルアプリでは1つのレイアウトしか使用できません。なぜ、複数のレイアウトを使用するのですか？ –

モバイルGmailのアプリでメディアクエリが機能しない

答えて

関連する問題