サクサク読めて、アプリ限定の機能も多数!
トップへ戻る
大谷翔平
qiita.com/kazhashimoto
CSSでheight:100%指定したimg、Safariで見ると画像がボックスをはみ出ていた意外な原因HTMLCSS テキストを画像化してimg要素としてdivに配置し、iPhoneやデスクトップ版のSafariで表示したら、なんだか画像のサイズがおかしい。CSSに指定したheightの寸法よりも大きく見える。インスペクタで要素の高さを確認したところ、問題のimg要素だけheightの計算値がおかしい!こんな現象にハマりました。発生条件が判ったのでメモ。 動作環境 macOS 10.14 (Mojave), Safari 13.1 現象 要素div.tabに固定のheightと上下にpaddingを持たせ、子要素としてimg要素をheight: 100%で埋め込みます(下図)。図で「LOREM IPSUM」はテキストを画像化したものです。デスクトップ版のChromeやFirefoxでは、
このページを最初にブックマークしてみませんか?
『qiita.com』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く