Internet explorer IE 9中框大小、边框框和最小宽度的问题

我使用的是框大小：边框框模型。当内联块元素（容器）中包含最小宽度为的内联块元素时，Internet Explorer 9中的容器太宽。在FF 10.0、Chrome 17.0、Opera 11.5和Safari 5.1.2中按预期工作

顺便说一句，width而不是minwidth很有魅力

---

有什么想法吗？

在用谷歌搜索IE 8的类似问题时，我看到了你的帖子，尽管IE 8支持框大小和最小高度/宽度，但从我的测试来看，IE 8在同一元素上使用最小高度/宽度时似乎忽略了边框框

例如

IE 8高度=28px，铬合金20高度=20px

使用css浏览器选择器的解决方案

---

我没有解决这个问题的办法，但我自己在谷歌搜索修复程序时遇到了这个问题。幸运的是，在我的例子中，我现在可以设置宽度而不是最小宽度，尽管这在将来可能会是一个问题

无论如何，我只是想补充一点，如果minwidth元素及其容器都是浮动的，而不是内联块，那么同样的问题也会存在

这里有一个对原始小提琴的更新，它显示了

float:left

：

我的问题 我看到边框框值在IE8开发者工具检查器中应用。因此，我知道边框框正在工作，特别是在设置宽度（或高度）时。但由于我使用最小高度作为我的高度（OP使用最小宽度），所以我的最小值不起作用。因此，问题是：

IE的最小高度/最小宽度不包含在边框框中

.box {
     padding: 30px;
     box-sizing: border-box;
     min-height: 200px;
}    

<div class="box">Awesome Box</div>

.box{
填充：30px；
框大小：边框框；
最小高度：200px；
}    
棒极了的盒子

• IE8:260px（填料顶部30px，填料底部30px）。不起作用
• FireFox:200px高度。（边框框中的最小系数）。工作

我的解决方案： 不要在放置最小值和边框框时将填充放在同一个元素上-（如果将它们分开，可能不再需要调整边框框大小）

.box{
框大小：边框框；
最小高度：200px；
}
.内胆{
填充：30px；
}  
棒极了的盒子

max width也有同样的问题感谢您的确认，我在正在开发的一个网站上看到过这种情况，我怀疑是这样，但只是想确认一下，因为官方支持最小高度/最小宽度。我感谢@htmlr。我一点也不喜欢用两种不同的方式设置最小高度/宽度，也不喜欢被迫使用“css浏览器选择器”。尽管如此，由于这似乎是IE8/9中的一个bug，您的解决方案还是有道理的。谢谢。您的解决方案很好，很可能被用作公认的答案。我之所以喜欢@htmlr的答案，是因为当我最终放弃对IE 8/9的支持时，我不必更改HTML，只需删除CSS中的.ie8/.ie9规则即可。

#box {
       min-height: 20px;
       padding:4px;
       box-sizing:border-box;
  }

 .ie8 #box, .ie9 #box {
       min-height: 12px;
       padding:4px;

 }

.box {
     padding: 30px;
     box-sizing: border-box;
     min-height: 200px;
}    

<div class="box">Awesome Box</div>

.box {
     box-sizing: border-box;
     min-height: 200px;
}
.box-inner {
     padding: 30px;
}  

<div class="box">
    <div class="box-inner">Awesome Box</div>
</div>