Css 框大小：边框框-如果随后更改边框，则不保持大小

我在使用框大小时遇到了一个问题：边框框：我有3个div大小，最小高度：24px我希望在添加水平边框时保持高度

问题是，如果在计算一次内容高度后添加水平边框，则内容高度不会更改，并且div会根据边框的值增长

在我的例子中，边框是在元素悬停时由CSS本身添加的

悬停时，第一个div的高度会增加，从而增加整个页面的高度↑

如果这是相关的：

该页面实际上被用作中的弹出窗口

我正在使用两个样式表，一个我不能修改extension.css，另一个我使用扩展并覆盖第一个页面small.css

一种样式应用于每个div，以用最小高度24px覆盖受保护CSS中的高度24px；允许元素随内容增长

当元素悬停时，如何在不改变外部大小的情况下管理此增长

1.不要包装{ 空白：nowrap； } .addl文本{ 左：1米； } .开始{ 显示器：flex； 弯曲方向：行； 调整项目：灵活启动； } col-1{ 最大宽度：300px； } pli-1， pli-2， pli-3{ 高度：取消设置；/*要取消*/ 最小高度：24px；/*…extension.css中的“高度：24px”*/ } 复选框 测验 这是一个非常好的例子，因为它是一个非常好的例子。 测验 测验

---

您的问题不在于框大小属性，边框不包括在边框框或内容框的计算中；元素的大小将始终随应用的边框的大小而增加

如果不希望元素的大小增加，则不要添加边框

如果您想要边界效果，而不需要边界的物理属性，那么我建议使用长方体阴影。使用长方体阴影创建边界效果很简单，并且不会增加应用到的元素的大小

例如：

box-shadow: inset 0 0 1px #333;

而不是：

border: 1px solid #333;

---

只需添加一个隐藏的边框，即可实现所需

为项目添加白色隐藏边框，这样高度不会增加。就像在片段中一样

.panel-list-item:not(.disabled) {
    border: 1px solid #fff;
}

您可能还需要调整其他样式以解决问题

.面板列表项：未禁用{ 边框：1px实心fff； } 1.不要包装{ 空白：nowrap； } .addl文本{ 左：1米； } .开始{ 显示器：flex； 弯曲方向：行； 调整项目：灵活启动； } col-1{ 最大宽度：300px； } pli-1， pli-2， pli-3{ 高度：取消设置；/*要取消*/ 最小高度：24px；/*…extension.css中的“高度：24px”*/ } 复选框 测验 这是一个非常好的例子，因为它是一个非常好的例子。 测验 测验

---

我不明白你所说的边框不包括在计算中是什么意思，因为框大小：边框框实际上定义为宽度和高度属性，最小/最大属性包括内容、填充和边框。这也让我感到困扰。对其功能的描述有点误导。如果图元没有明确的高度，它将更改图元的高度，因为没有要计算的高度。它真正的意思是，我们会将边界因素考虑到你给我们的高度，如果你不提供高度，我们不会计算任何东西。谢谢，这是对我问题的一个很好的回答，但它看起来也像一个旁路。Firefox49中的框大小调整行为真的有问题吗？没有。我认为，在任何最新的浏览器中，框大小调整都没有问题。您的问题是预期的行为。在没有任何边框的div上添加边框时，高度将增加以包含该边框。要消除闪烁，你必须这样或那样做。那不是绕道。或者也可以添加框阴影以获得效果。如果答案有帮助，请将其标记为已接受，以帮助未来的访问者。