首页 > web前端 > css教程 > 如何在 Firefox 34.x 及更高版本中恢复 Firefox 33.x Flexbox 行为?

如何在 Firefox 34.x 及更高版本中恢复 Firefox 33.x Flexbox 行为?

DDD
发布: 2024-12-24 03:50:17
原创
621 人浏览过

How Can I Restore Firefox 33.x Flexbox Behavior in Firefox 34.x and Later?

在 Firefox 34.x 及更高版本中从 Firefox 33.x 恢复 Flexbox 行为

Firefox 的最新更新(版本 34 和 35)改变了 Flexbox 的默认行为。如果您的应用程序布局严重依赖 Flexbox 并注意到意外的变化,本文将指导您在较新版本中复制 Firefox 33.x 中的行为。

Firefox 33.x 中 Flexbox 之间的主要区别而 34.x 的关键在于引入了“弹性项目的隐含最小尺寸”。此功能已被删除,然后重新添加到 Flexbox 规范中,它为 Flex 项目分配最小尺寸,导致它们在某些情况下延伸到视口之外。

从 Firefox 33.x 恢复该行为,您可以添加以下样式规则:

* { min-height: 0; }
登录后复制

此规则有效地将所有元素的最小高度设置为 0,从而允许 Flex 布局的行为与 Firefox 中一样33.x.

或者,您可以仅将 min-height: 0 应用于满足以下条件的特定元素:

  • 垂直方向(列)弹性容器的子级
  • 包含一个需要溢出的高个后代

在你的特定在这种情况下,您可能需要在应用程序中的整个嵌套 Flex 容器中应用 min-height: 0,因为层次结构中的每个元素可能都有一个需要溢出处理的高后代。

有关内容的其他见解和示例受此 Flexbox 规范变更影响,请参阅以下 Mozilla 错误报告:https://bugzilla.mozilla.org/show_bug.cgi?id=1043520

以上是如何在 Firefox 34.x 及更高版本中恢复 Firefox 33.x Flexbox 行为?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板