今回の事例としては「リストの項目の中で文字に強弱をつける」というものでしたので
<ul> <li><span class="cap">キャプション</span>もじもじもじもじ </ul>
というHTMLに
.cap {
font-size:80%;
color:#666;
line-height:120%;
}
というCSSをかけました。
ところが、行間がつまらなかったのです。
▼参考になったページ
span等インライン要素にline-heightが効かない!
なるほど、「display:block;」を追記したら、たしかにいうことをきくようになりました。
が、なぜか、上下の他の要素との間に盛大にスキマが出来てしまいました。
なかなかパッと思い通りにはならないですな~