Android PhoneGap은 CSS3를 지원하지 않습니다. Flexbox

Question

PhoneGap의 Android 브라우저가 CSS3 flex 상자를 지원하는지 여부를 아는 사람이 있습니까? 브라우저에서 코드를 실행하면 제대로 작동하지만 안드로이드 장치에서는 작동하지 않습니다.

.di { 
    float:left; 
    width:100%; 
    text-align:left; 
    display:flex; 
} 

.di span { 
    background:url('img/smallphone.png') no-repeat; 
    height:15px; 
    border:1px solid #005522; 
    float:left; 
    width:24.2%; 
    text-align:center; 
    border-radius: 10px; 
    background-color:white; 
    flex:1 
} 

Answer 1

는 사실, 폰갭은 어떤 CSS를 지원하지 않습니다 여기에

는 코드입니다.

PhoneGap은 장치의 기본 브라우저를 사용하는 webview를 사용합니다.

그래서 CSS 지원은 기기의 브라우저에 따라 다르므로, Android 2.3, 4.0, 4.1 또는 4.4에서 실행하면 동일한 앱에서 다른 CSS 동작이 발생합니다.

다른 브랜드의 기기를 사용하는 경우 특정 버전의 Android에서는 지원이 다를 수 있습니다.

그게 바로 phonegap의 주요 문제입니다. 말했다

, 그것은 안드로이드 2.1부터 지원하는 플렉스 상자 보인다 http://caniuse.com/#feat=flexbox하지만이 시도 접두사를 -webkit

을 추가해야

.di { 
    float:left; 
    width:100%; 
    text-align:left; 
    display: -webkit-flex; 
    display:flex; 
} 
.di span { 
    background:url('img/smallphone.png') no-repeat; 
    height:15px; 
    border:1px solid #005522; 
    float:left; 
    width:24.2%; 
    text-align:center; 
    border-radius: 10px; 
    background-color:white; 
    -webkit-flex: 1; 
    flex:1; 
}