在用CSS布置页面时,您是否知道元素在Internet Explorer中“具有布局”是什么意思? 如果没有,您可能会错过一个有用的工具来克服该浏览器中CSS错误。 再说一遍,您可能会错过关于正在处理的错误的解释。
在Internet Explorer的内部工作中,布局时页面上的每个元素都以两种模式之一运行。 它要么允许其祖先影响其内容的位置,要么简单地获取页面的矩形区域并在该矩形内进行其内容的所有布局。 后者的元素称为“具有布局”,因为您可以通过使用JavaScript检查仅IE的hasLayout属性来检测它们。
事实证明,强制元素“具有布局”是克服Internet Explorer中CSS错误的一种方法。 例如,Internet Explorer有一些错误,由于其父母或其他祖先的影响,这些错误会导致浮动元素及其后代的位置错误。 通过将浮动元素的父级欺骗为“具有布局”,可以消除不必要的影响,这通常会使浮动元素正确定位。
不幸的是,由于“具有布局”的元素会忽略其祖先,因此它们的行为并不总是您期望的那样。 例如,它们不能有溢出的内容,也不能环绕浮动的元素。 从本质上讲,“具有布局”赋予Internet Explorer权限,使它们可以使用更简单的代码绕过某些错误CSS代码,而这些代码通常可以通过忽略页面布局标准来完成工作。
强制元素“具有布局”可以很简单,只需为其分配固定宽度即可。 这项技术最著名的应用是Holly Hack ,尽管当它于2003年发布时,没人知道“具有布局”……这只是一种似乎有效的hack。 既然Internet Explorer的开发已经全面展开,并且IE团队正在与标准小组进行讨论 ,我们开始对浏览器的这些晦涩的细节有所了解,这些细节可以解释其行为的更多精神分裂症方面。
Microsoft的新发表文章对“具有布局”进行了简短但有用的总结-哪些元素拥有布局,其他元素如何获取以及它们一旦完成后的行为。 这篇文章令人耳目一新,坦率地说浏览器的错误。 如果您想更详细,你可以度过一个安静的下午, 在具有布局 ,在“有布局”的主题很长的和详细的论述,以及许多方面,它可以帮助或在Internet Explorer中阻碍你CSS布局的努力。
翻译自: https://www.sitepoint.com/got-layout-internet-explorers-page-layout-secrets/