★今回はブログやサイトのiPhone X 画面の対応に関して★ CSSで画面の被りを解消する方法 「iPhone X」の画面の構造 セーフエリアの考え方 ①METAタグで「セーフエリアあるよ」と教える! ②次も簡単!CSSでセーフエリアまで底上げすれば良い はてなブログの人は... 実は遅まきながら…つい先日iPhone6sから→iPhone XSに機種変したんです。 それで自分のサイトを見てみたら、 がーん!!! 被ってんじゃん!!! せっかく気に入って設置していた、自作のスマホ用のボトムメニューに画面下のバーが被ってしまい見えなくなっちゃっています... ちなみに自作のスマホ用ボトムメニューのCSSはこちらで公開しています↓↓ 【レスポンシブ】スマホ固定フッターメニュー★ボトムメニュー それに、角も丸まっているので、そこに何か表示している場合は見えなくなっちゃう可能性もあると言うわけで
![iPhone Xのセーフエリアとは?表示が画面下のホームバーと被る時の対処法(CSSのみで対応可) - バンビの初心者ブログ教室](https://cdn-ak-scissors.b.st-hatena.com/image/square/af66e00cba778cf79bab3ca04986570161d2a0ea/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fz%2Fzuboraca%2F20181019%2F20181019123942.jpg)