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

2021年5月30日公開・2021年5月30日更新

概要
・画像上に背景付きの文字をabsoluteで重ねて左上に配置した
・iPhoneだけなぜか画面外にはみ出る

原因

absoluteとpaddingを一緒に設定していたこと。

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

paddingを子要素に移動することで無事解決。

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

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

はい！の方は以下をポチっと

いいえ..

ヤフーに戻る