css - 我主页上的 Flexbox 在 IE 11 上无法正常工作

Question

我的客户向我报告了一个问题，即 flexbox 无法在主页（WordPress 网站）上的产品卡部分工作 https://hailinpower.com/

这是它在 Chrome 上的样子：截图：

这是它在 IE 11 上的样子： IE 11 上的屏幕截图：

我已经寻找解决方案，但我无法修复它。我试图设置一个高度：589px 到 flex 容器，也是 flex children div，但它没有工作......

我在本节中添加了一个自定义 CSS 代码，如下所示：

.home-page-row .kt-row-layout-inner .kt-row-column-wrap .wp-block-kadence-column .kt-inside-inner-col {

    display: flex;
    flex-direction: column;
    flex: 1;
}

此自定义 CSS 代码可能是导致此问题的原因？

标签： csswordpressflexboxinternet-explorer-11

Answer 1

更改您的自定义 CSS

.home-page-row .kt-row-layout-inner .kt-row-column-wrap .wp-block-kadence-column .kt-inside-inner-col {

display: flex;
flex-direction: column;
flex: 1;
}

flex: 1至flex-grow: 1

我已经在 IE11 的调试面板上完成了它并且它有效，请参见下面的图像