CSS边框调整自身大小

Question

我是CSS的新手，我遇到边框问题。我有一个标题，下面有一个边框。我还有一些文本稍后用javascript添加。

问题是，当javascript文本出现时，它会超出标题的末尾。这会导致边框延伸。

我能做些什么来阻止这种情况吗？

Answer 1

在标题的CSS中，添加以下CSS定义：

overflow: hidden;
line-height: 32px;
height: 32px;

高度仅用于确保标题高度不会移动，溢出会将所有内容剪切到标题框的维度。行高将导致内容垂直居中

Answer 2

  

[...]“这会导致边框延伸。

     

我能做些什么来阻止这种情况吗？“

好吧，如果问题（正如你在上面解释的那样）严格地只与边界变长有关，那么你应该与另一个元素建立边界。使用此CSS在标题的底部放置<hr>：

hr.border
{
    position: absolute;
    bottom: 0;
    left: 0;
}

然后当然从标题中删除底部边框。