MARKLEAPS[マークリープス]

TECH BLOG

マークリープス技術ブログ

open

min-widthのリセット時はinitialとautoを併用

min-width initialとautoを併用

 

古いAndroidでmin-widthが効かない!

これまで、PC表示時に設定したmin-widthをスマホ幅でリセットする際、min-width: auto; を使用していました。
しかし先日バージョンの古いAndroid端末で表示確認をした際、min-widthのリセットが効いておらずスクロールバーが出てしまっているのを発見!
あらためて調べ直し、以下の方法で解消しました。

 

min-widthのリセットにはinitialとautoをセットで記述!

min-widthをリセットするにはinitialとautoを併用する事で解消しました。

 

なお、min-widthの他に、min-height、max-width、max-heightをリセットする際にも
initialとautoを併用します。

initialとは?

各プロパティを初期値に戻す設定値です。CSS3から使用可能になりました。
全てのCSSプロパティで使用することができます。
参考:CSS – initial

 

min-widthを初期値に戻す際は基本はinitialを使用し、
auto はinitialが効かないIEの為に記述します。(IE、またお前か…)

よく読まれている関連記事

関連最新記事