跨浏览器柔性盒兼容性问题

Question

我正在构建一个webapp，它至少必须与IE10+、Chrome、火狐和iOS兼容。

它在Chrome上运行得很好。但是，每次我修复IE或Firefox上的附带错误时，都会在iOS上创建一些bug，反之亦然。

最近的问题是由于火狐和iOS。在修复之前，iOS运行良好(overflow滚动得很好)，但是火狐没有尊重它的父宽度，右边的flex不在屏幕上。一旦我在火狐上解决了这个问题，溢出滚动将不再适用于iOS。

关于IE10，一些嵌套的柔性盒也不尊重其父程序的宽度，最后一个框离屏幕(?)有一半的距离。

您是否有一个可靠的资源，跨浏览器开发与柔性盒？我已经尝试过一堆指南，但它们帮助修复某个浏览器上的错误，并在其他浏览器上创建了一个新的.

编辑：说明每个浏览器如何处理属性的比较表。

谢谢。

Answer 1

很可能，您想要实现的仅仅是使用flexbox并不可行，您列出的所有浏览器都不完全支持它。

众所周知，Flexbox在IE10上存在缺陷，并且可能需要在您正在构建的许多浏览器上使用前缀。下面是了解哪些浏览器完全支持任何给定功能的一个很好的资源：http://caniuse.com/#search=flexbox。

您可能会发现“已知问题”部分与确定您所拥有的问题是否已被记录有关。

一些关于您遇到的bug的特定信息可能有助于提供一个更具体的答案。

Answer 2

听起来你想要这样：

https://github.com/philipwalton/flexbugs

自诩为“由社区策划的挠性盒问题和跨浏览器解决方案的列表”。