Flexbox 列裁剪图像（仅在 iOS 上）答案

【问题标题】：Flexbox column cropping image (on iOS only)Flexbox 列裁剪图像（仅在 iOS 上）
【发布时间】：2016-12-20 04:10:48
【问题描述】：

1) 我一直在开发一个使用 flexbox CSS 样式来控制网站布局的网站。我一直在使用FLA Framework 编写这个网站 - 与facebook.design 相同。

Firebug 和 Chrome Inspector 显示代码布局没有问题，但是在移动 iOS Safari 和 Chrome 上，当使用 flexbox order 时，图像会被裁剪。（据我所知）。

我已采取的解决此问题的步骤是将-webkit-order: x; 添加到样式表中，但这没有任何效果。

该网站可以在这里看到：LINK

【问题讨论】：

发布最小工作代码 sn-p 以重现该问题。指向外部资源的链接往往会失效，当它们失效时，这些问题对未来的用户来说将毫无用处，而且，我们不应该通过完整的网站解析来查找和找出您遇到的问题。
我可以，但是当我使用代码所依赖的 flex 框架时会很棘手。我只是删除上面和下面的代码并重新发布小提琴。我真的很想看看是否有其他人遇到同样的情况并找到解决办法。这在有框架和没有框架的情况下都发生过，但只能在 iOS 设备上复制 - 它在浏览器和 firebug 上看起来很好。

标签： css flexbox

【解决方案1】：

我没有 iOS 设备所以无法检查这个，但您是否检查过将移动设备的溢出属性更改为自动？

@media screen and (max-width: 40em){
  section.popup{
    overflow:auto;
  }
}

【讨论】：