レスポンシブサイトを制作していて、メディアクエリを使用して、cssを振り分けています。しかし、iphone6Sとiphone6Plusだけスマホサイトを表示してくれません。

2:ID:RoQCiQ · 2017-07-31

なんだろう？
普通はメディアクエリが適切に設定されているなら、起きないはずだけど。。。
できればどのように設定しているのか知りたいかもです。
あと表示がうまくいったスマホの機種とかも知りたいです。

提案だけど
スマホcss　だけでなくpc用のcssにも下記のようにしてみてはいかがですか。
<link rel="stylesheet" media="screen and (min-width: 769px)" href="css/styles.css" rel="stylesheet" type="text/css" />

1いいね!

3:ID:主 · 2017-07-31

スマホのcssには、このように記述してあります。
media screen and (max-width: 640px)

表示されたのは
iPhone5
iPhone6
iPhone7plus
です。

5:ID:BdR5Dc · 2017-07-31

Re:3
https://www.paintcodeapp.com/news/ultimate-guide-to-iphone-resolutions
　iPhone6 なら screen and (max-width : 667px)
　iPhone6Plus なら screen and (max-width : 736px)
でないと表示されないと思う。

…のだけど、なぜ iPhone7Plus が表示されたのか謎い。

2いいね!

6:ID:RoQCiQ · 2017-07-31

Re:5
>、なぜ iPhone7Plus が表示されたのか謎い
ここだよね。腑に落ちない。

キャッシュとか大丈夫？シークレットブラウザで確認してみるとか。

1いいね!

7:ID:RoQCiQ · 2017-07-31

Re:6
viewportとか適切にされてる？

1いいね!

8:ID:主 · 2017-08-01

Re:5
下記の様に書きましたが、表示されませんでした。

　iPhone6 なら screen and (max-width : 667px)
　iPhone6Plus なら screen and (max-width : 736px)

同じサイトをパソコンのブラウザでウインドウの幅を縮めたら
スマホサイトは表示されます。

9:ID:RoQCiQ · 2017-08-01

Re:6
キャッシュクリア
http://seechina365.com/2016/02/14/safari_cash/

1 件の回答が除外されました。[詳細]

コメントの受付は終了しました。

#質問レスポンシブサイトを制作していて、メディアクエリを使用して、cssを振り分けています。
しかし、iphone6Sとiphone6Plusだけスマホサイトを表示してくれません。

8 件の回答

一緒に読まれている質問

#質問 レスポンシブサイトを制作していて、メディアクエリを使用して、cssを振り分けています。しかし、iphone6Sとiphone6Plusだけスマホサイトを表示してくれません。

8 件の回答

一緒に読まれている質問

#質問レスポンシブサイトを制作していて、メディアクエリを使用して、cssを振り分けています。
しかし、iphone6Sとiphone6Plusだけスマホサイトを表示してくれません。