iOS Gmail アプリの HTML メールの「画面に合わせた表示」を強制的にオフる

March 04, 2015

HTML メールをコーディングして iOS の Gmail アプリでテストすると、レスポンシブ対応をしていない場合に「画面に合わせた表示」だと崩れることがある。

それでも崩れないようにするのがベストだけど面倒くさいので、どうにかして最初から「元の表示」にしておきたい。

その場合、メディアクエリとか使ったりいくつか方法があるみたいだけど、てっとり速いのは以下のコードを HTML のどこかに入れておく方法。

<pre class="lang:default decode:true "><div style="display:none; white-space:nowrap; font:15px courier; color:#ffffff;">
    - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
</div>

このコードは幅 600px に最適にしているので、サイズに合わせて の数を調整する必要がある。

メルマガ作成等の際にこの「画面に合わせた表示」でお困りの方は是非お試しください。

バージョン 3.1415926 ではこの方法は有効でしたがバージョンによっては使えなくなる可能性があります。)


Profile picture

Johnny Okafuji
フロントエンドエンジニア / ビートルズバンド Crescendo Four のジョン・レノン担当。/ Love Darts🎯 / 独学でコーチング勉強中 / コーチング関係の記事は note に書いてます。
Twitter: @johnykei
note: https://note.com/johnykei

© 2021 All rights reserved.