当我创建一个通用按钮类来设置从div到输入的所有内容时，我遇到了一些奇怪的错误。在输入[type = submit]时，似乎大多数浏览器使用不同的盒子模型。
大多数现代浏览器（ie9 +，ff，chrome等）对所有输入使用内容框框模型，除非提交使用border-box，如果我没有弄错的话。
基本上，如果我将高度设置为100并且填充为10，则除了提交之外的所有输入的高度将为120，其中提交的高度为100。
使用box-sizing及其浏览器前缀可以轻松修复此问题。但我的问题是IE6 / 7做同样的事情，但不支持大小调整...
所以现在我的所有输入都显示全高，除了提交被切成两半。我有什么选择强制内容框或其他修复除了条件注释？
答案 0 :(得分：1)
IE旧的“破损”盒子模型基本上是content-box。在IE> 5中，文档需要处于怪异模式以供IE使用。您可以通过执行以下操作之一（according to wikipedia）来触发怪癖模式：
当然，这可能比它的价值更麻烦，因为它会使所有使用IE框模型（content-box）。我可以看到这很有用，但是如果你的布局不是这样构建的，那么返回并改变它可能需要做太多的工作。
我做了一些搜索，并没有找到任何可以在某些元素上启用旧盒子模型的东西，而不是其他元素。
过去曾经处理过IE6 / 7，如果不使用条件评论或css hacks之类的东西，就没有办法解决它的错误行为。与其他浏览器相比，它的渲染引擎从根本上被破坏了。试图让它在没有任何黑客行为的情况下行动只是一件令人头疼的问题。
我唯一能想到的是用span或div包围每个表单元素，并使用它们来帮助调整表单元素的大小。这也很糟糕，但它的优点是至少可以在每个浏览器中工作。