html - CSS のパディングに使用しているパーセンテージが機能しないのはなぜですか?

Question

CSS のパディングにピクセルではなくパーセンテージを使用していますが、機能していません。

.menu li a{ padding-left:5%; padding-right:5%;}

パーセンテージを使用して、メニュー セクションをすべての次元でレスポンシブにしたいと考えています。どうすればこれを達成できますか？

Answer 1

あなたが書いたものは技術的には問題ありません。上書きされる可能性がありますが、それは1つの可能性にすぎません。親要素の幅にも依存します。

Answer 2

アンカーリンクでピクセル値を定義します

交換%するpixel value

padding-left:5px;
padding-right:5px;

デモ

Answer 3

％はここで機能していますが、「li」要素内のアンカータグに幅が指定されていないため、効果を確認できません。

効果を確認したい場合は、「＃coolMenu lia」に「width：100px」を配置してみてください。％パディングの効果がすぐにわかります。