人気の株主優待

weblovelog

ウェブ業界人のためのウェブ情報サイト。

スマホで見ると「あれっ?右側だけ少し余白が…」という時の対処法

   

レスポンシブじゃないサイトを作成している時…

PCではちゃんと横幅一杯に広がっているのに、スマホで見ると「あれっ?右側だけ少し余白が…」という時の対処方法。

68b59e3e9c697b5f95c16862e2a1464d_s

① 親div に「 min-width: ◯◯px; 」を指定。

※○○部分は、例)900pxの幅で表示したい時→900px

http://ameblo.jp/trapshooter/entry-11712741729.html

に書かれている投稿によると、この現象は、

「外側のdiv に100%指定して、その子(内側)div にpx指定していると発生」

するようです。

② メタタグの viewport 設定で解決

http://miz2403.com/viewport-settei/

head内に下記の一行をいれると解決しました。

 - CSS, WEB, スマホサイト

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

  関連記事