Q&A
Next.jsで作ったサイトで、一部の画像が、Developerツール及びXcodeで立ち上げたシュミレーター上では正常に表示されるのに、実機で確認すると画像が途中で切れているように表示され、少しだけズームすると正常な状態で表示されるという問題にハマっています...。
解決策をご存知の方がいれば、ぜひご教示いただければと思います。よろしくお願いいたします。
*ブラウザは両方ともSafariを使っています。
| 実機 | シュミレーター |
|---|---|
 |  |
該当画像部分のコードは以下の通りです：
React
1<div style={{width: "62%", 2 z-index: 100, 3 margin-top: 20}} > 4 <img src="a" width="100%" /> 5</div>
回答1件
0
iPhoneを持っていないので手元で試せなくて恐縮ですが…
実機ならではの問題解決であれば、MacとiPhone実機をつないだ上でDeveloperツールで見てみてはいかがでしょうか。
Safari単独の開発者ツールはあくまでシミュレータなので。
こちらの方は実機特有の現象としてiPhoneX以降のノッチの問題でしたとの事。
https://teratail.com/questions/317401#reply-44187
Android/iOS端末でChromeとSafariのデバッグをする - Qiita
https://qiita.com/spre55/items/5968e759178ac0617cde
【iPhoneX対応】webサイトのSafe Area対応（iOS11.1とiOS11.2） - Qiita
https://qiita.com/kanakana0330@github/items/6ae264b9da00c326ab1d
投稿2021/01/24 14:20
退会済みユーザー
総合スコア0
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。