css - 垂直节奏的填充

Question

我有一个非常基本的问题来选择垂直节奏的填充大小。

让我们这么说：

.body{
    font-size: 14px;
    line-height: 18px;
}

我们有一个带有内容的 div（div 有一个边框）：

<div class="content">
     ... a very large text content here ...
</div>

以下哪一项是垂直对齐的正确选择，这个：

.content{ padding: 18px; .... }

还是我应该考虑差异 (18-14)/2 = 2px，所以：

.content{ padding: 16px 18px 16px 18px;  .... }

或者如果两个答案都是错误的，请您解释一下如何解决这个问题。

score 0 · Accepted Answer

您应该在容器的顶部和底部设置相同的填充。例子：

.content {
padding: 10px 0;
line-height: 14px;
}
<div class="content">
 ...some text here...
</div>

您也可以设置 div 的高度，然后设置相同的 line-height

1 回答 1