Html 高度100%不适用于所有浏览器

我创建了一个简单的引导“

输入组”

”示例，它在Chrome中运行良好，但在IE和Firefox中不起作用

---

正如您在示例中所看到的，“帮助”按钮并没有填充其父按钮的全部高度。在Chrome（58版）中，它可以正常工作。

请为输入组设置一个高度

.input-group {
    width: 100%;
    height: 10px;
}

那么它应该像预期的那样工作

---

这个问题还有另一个很好的答案。

删除

顶部填充

和

底部填充

。输入组{
宽度：100%；
}
.输入组btn{
身高：100%；
}
.btn{
身高：100%；
填充顶部：0！重要；
填充底部：0！重要；
}

选择1
选择2
帮助

家长需要

身高：100%

。输入组{
宽度：100%；
}
.input group btn、.outer、.btn{
身高：100%；
}

选择1
选择2
帮助

您链接的线程声明“父元素（*）必须具有明确的高度。这是不言而喻的，”如果是这样，那么为什么行为取决于浏览器……在某些情况下，您希望容器的高度取决于某些，但并不是所有的孩子和其他一些孩子都依赖于容器的高度…