Css 为什么图像不是'；当使用display:flex时，safari上显示t&；弯曲流：柱；使用顺序：1/2；关于子元素？

以下是我以前的帖子：

我想你应该读一读，因为我的页面结构在这里解释得很清楚。（答案也是，我保证不会太长）

我用过：

    display: flex;
    flex-flow: column;

在容器div上，并为其提供了2个子元素（一个图像，另一个是div）：

及

例如：

问题是，在iPhone上，图像不会显示

有什么简单的解决办法吗

.page-wrap {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
 }

---

从

中获取的参考看起来您可能存在一些跨浏览器问题。你也许能够解决所有这些问题。对于您的

flex

布局系统，请确保您仍然是供应商的前缀，特别是

-wekbit

，用于使用Chrome和Safari浏览器

范例

display: -wekbit-flex;
-webkit-flex-flow: column;
-webkit-order: 2;

---

-使用

-wekbit

前缀

我将其添加到CSS中，但它不起作用。我确信这是因为当我在chrome开发工具上打开页面时，我禁用了“

display:flex；

”并获得了与手机上完全相同的视图。我将此添加到CSS中，但它不起作用。我确信这是因为当我在chrome开发工具上打开页面时，我禁用了“

display:flex；

”并获得了与手机上完全相同的视图。您已经找到了原因，轻松修复：）是的，那么如何应用修复。这是我的css:

.part2.container{/*最小高度：6.5em；高度：inherit；*/页边距底部：7em；宽度：100%；显示：flex；显示：-webkit flex；显示：-ms flex；显示：-moz flex；-webkit flex flow:column；flex flow:column；/*位置：相对；*/}

.page-wrap {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
 }

display: -wekbit-flex;
-webkit-flex-flow: column;
-webkit-order: 2;