久しぶりにCSSをいじった件

箇条書きスタイルのリスト表示は本文よりやや小さめにしているのだけれど、行頭に連番を振る「<ou>」タグと中黒を表示する「<ul>」タグが入れ子になっている場合、階層が深くなるにつれて等比級数的に文字が小さくなってしまう。

上記ふたつのタグにそれぞれ「font-size」を「%」で指定しているから当然なわけなんだけど、かといって「<li>」タグにのみ「font-size」を「%」で指定しても同じこと。

「どうすりゃいいんだろう」と思いつつ放置していたわけですが、先ほど解決いたしました。

なんのことはない、「<ou>」タグと「<ul>」タグのプロパティは「padding」と「margin」だけにし、「<li>」タグで「font-size」を「x-small」と指定すれば、とりあえずOKですね。

結局、「font-size」の指定方法によって継承元が変わってくる、ということがわかってなかったわけです。ははは。

いやあ、CSSは奥が深いわ。