ios上のブラウザ(safari,chrome)での表示がおかしいです
ios 14.2のchrome version87.0.4280.77とsafari(最新)で、以下のindex.htmlを表示させたところ 本来であれば、４つの正方格子が表示されるところ、高さ方向が潰れて表示されます。 なお、pcのほとんどのブラウザでは、意図した表示になっております。 サイトにもアップしておきます。 https://atxrtc.firebaseapp.com/ おわかりになる方、おしえてください。 以上、よろしくおねがいします。 ------------------- index.html ------------------- <!DOCTYPE html> <html lang="ja"> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="IE=edge,chrome=1"> <m
CSS | ios で position:absolute top: 50% がずれる
質問をすることでしか得られない、回答やアドバイスがある。15分調べてもわからないことは、質問しよう！新規登録して質問してみよう
【iOS】iOS Safariでposition:fixedを使ってoverlayするとスクロール時に下のレイヤーが見える - UGA Boxxx
iOS15からSafariでは画面下部にナビゲーションがつくようになった このナビゲーションはスクロールの方向によって大きさが変わる position:fixedを使って高さいっぱいの手前にoverlayするモーダルをつくる場合、大きい方のナビゲーションが表示されている状態でスクロールさせると、モーダルの高さがナビゲーションの縮小に追随できず下に隙間ができてしまう そして、スクロールが終わると急に吸着する挙動になる iOSの仕様というかバグというか、これに付き合わなければならないみたい 対策 いろいろ調べた結果、モーダル表示時に以下のスタイルをあてるととりあえず回避できる bodyタグにposition: fixed; overflow: hidden; inset: 0px; ※スクロール位置を保持したい場合は、topを調整する htmlタグにheight: 100vh; まず、1. は
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
