iPhoneでabsolute要素が画面外にはみ出したときの対処法【CSS】

2021年5月30日公開・2022年1月15日更新

概要
・背景付きテキストをabsoluteで画像上に配置
・iPhoneのSafariだけなぜか画面外にはみ出る事象が発生

結論

原因はabsoluteとpaddingを併記していたこと。

padding用の子要素を新たに設けることで無事解決した。

<div class="position-absolute">
  <p class="p-3">テキスト</p>
</div>

SafariのIE化が止まらない。

この記事は役に立ちましたか？

はい（以下をポチッと）

ぜんぜん

ヤフーに戻ります