いきなり問題です。

以下ではボックスの中にテキストがある場合、要素の高さを取りたいのですが、3つの内どれが正解でしょうか?

https://codepen.io/funclur/pen/OKQdLj

1つ目は高さをテキストが超えてしまいます。

3つ目は複数行になった時行間が高いことが分かりますね。(1行だと高さを変えられると勘違いしやすい)

このように複数行になることを予め予期しておくことも必要です。

そう考えると正解は2ですね。

line-heightは行間を取るために指定しましょう。決してline-heightで位置の調節してはダメですよ!