2013-09-11 3 views
5

내 flexbox 레이아웃을 flexboxes의 March 2012 draft을 사용하는 IE10과 호환되도록하려고합니다. 나는 모든 변덕스러운 구문과 모든 변형을 시도했지만 아무 소용이 없다. Parallels에 설치 한 IE10 (Mac을 사용하고 있습니다)은 10.0.9200.16660이며, IE10 플렉스 박스 스타일을 사용해야합니까?IE10 및 flexbox 문제 - 2012 년 3 월 초안이 작동하지 않습니까?

.uberflex { 
    display: flex; 
    flex-direction: column; 
    flex-wrap: wrap; 
    justify-content: flex-start; 
    align-items: flex-start; 

    display: -webkit-flex; 
    -webkit-flex-flow: column wrap; 
    -webkit-justify-content: flex-start; 
    -webkit-align-items: flex-start; 

    display: -ms-flexbox; 
    -ms-flex-direction: column; 
    -ms-flex-pack: center; 
    -ms-flex-wrap: wrap; 
} 

나는 (그들이 IE11에서 무엇을 사용) "-ms-"접두어와 "-ms-"접두사없이 이러한 용어의 모든 varition처럼 보이는 시도했다 : 여기

내 코드입니다 그러나 아무 소용이 없습니다. IE 콘솔에 나와있는 클래스의 유일한 속성은 "display : -ms-flexbox" 비트입니다. 나는 매우 느리거나 IE10에 대해 잘못된 초안을 사용하고 있습니까? flexboxes가 작동하지 않는 IE10에 대한 업데이트가 있습니까?

주제에 관해서는 거의 찾을 수 없었기 때문에 어떤 정보라도 도움이 될 것입니다. 고맙습니다! :-)

+1

에 순서를 전환하려고? – thirtydot

+0

예, IE10에서 정상적으로 작동하는 것 같습니다! 이걸로 놀아야 해. 고마워! – shanling

+2

해당 사이트를 무시하면 브라우저가 실제로 지원하지 않는 경우 flexbox *가 어떻게 보이는지 에뮬레이트하기 위해 JavaScript가 사용 된 것으로 보입니다. 이 데모를보십시오 : http://css-tricks.com/using-flexbox/. 제쳐두고, IE가 실제로 IE10 모드에 있는지 확인하십시오. 개발자 도구 (F12)를 확인하거나'head 안에'를 추가하십시오. – thirtydot

답변

1

이 추측의 비트이지만, http://flexiejs.com/playground/ 작동합니까 당신의 IE10에서

.uberflex { 

    display: -ms-flexbox; 
    -ms-flex-direction: column; 
    -ms-flex-pack: center; 
    -ms-flex-wrap: wrap; 

    display: -webkit-flex; 
    -webkit-flex-flow: column wrap; 
    -webkit-justify-content: flex-start; 
    -webkit-align-items: flex-start; 

    display: flex; 
    flex-direction: column; 
    flex-wrap: wrap; 
    justify-content: flex-start; 
    align-items: flex-start; 
} 
관련 문제