Webview不支持Android Jellybean上的弹性框

ali*_*iry 4 html5 android css3 webview

我有一个webview加载一个包含弹性框的网页.Flex盒Div在Kitkat模拟器上正确显示,但它不适用于较旧的Android版本,如Jellybean.框必须水平显示,但它们实际上是垂直显示的.

这是我的HTML代码:

<!DOCTYPE html>

<html>
<head>
    <meta charset="utf-8" />
    <title>test</title>
</head>
    <body>
        <div style="display:flex; 
                                align-items: flex-start; 
                                justify-content: flex-start; 
                                flex-direction: row; 
                                flex-wrap: nowrap; 
                                width: 50%; height: 20%; 
                                background-color: red;">
            <div style="background-color: orange;">BOX 1</div>
            <div style="background-color: yellow;">BOX 2</div>
            <div style="background-color: green;">BOX 3</div>
        </div>
    </body>


</html>
Run Code Online (Sandbox Code Playgroud)

Joh*_*erg 7

我认为你需要根据旧的flex box规范为所有内容添加前缀,例如-webkit-box-flex-foo: bar;.

对于方向,您可能需要使用orient,例如:-webkit-box-orient: vertical/horizontal;.