【问题标题】:Flexbox items are collapsing in Safari, IE11 & IE10Flexbox 项目在 Safari、IE11 到 IE10 中折叠
【发布时间】:2016-03-03 03:40:15
【问题描述】:

我在 Safari、IE11 和 IE10 中遇到了一些嵌套弹性框的问题。面板应该是并排的(50% 宽度),并且其中包含不同数量的内容。 <cite> 元素应锚定在面板底部,并且每个面板的高度应相同。

这里有一个代码笔来说明:http://codepen.io/anon/pen/BKNRBY

这在 Chrome / Firefox 中运行良好,但在 Safari、IE10 和 IE11 中,面板不会垂直拉伸以包含其内容。

谁能给点建议?

【问题讨论】:

  • 第一步,考虑浏览器的兼容性。 Safari stackoverflow.com/a/35137869/3597276
  • 笔正在使用自动前缀来处理供应商前缀。
  • 很高兴知道。这在代码本身中并不明显。我在上面发布的链接还包含对常见浏览器错误和解决方法的引用。

标签: css flexbox


【解决方案1】:

找到它,将 blockquote 上的规则从 flex-basis: 100% 切换到 flex-basis: auto 就成功了。

【讨论】:

    猜你喜欢
    • 2015-12-17
    • 2015-03-01
    • 2016-02-21
    • 2021-10-06
    • 2017-03-14
    • 2015-01-19
    • 2018-06-27
    • 1970-01-01
    相关资源
    最近更新 更多