ie10 flexbox enigmandrum: um travester enigma

frustrado pelo comportamento enigmático do Flexbox no ie10? Não é só você. Apesar de sua adoção generalizada nos navegadores modernos, o suporte do FlexBox no IE10 deixa muito a desejar. &&&]

display: flex; Flex-Direction: Row;

}

. Formulário flexbox entrada [type = submit] {

display: flex;
flex-direction: row;

largura: 31px;

}

. Formulário flexbox entrada [type = text] {

display: flex;
flex-direction: row;

largura: auto; Flex: Auto 1;

} `

Na teoria, esse layout deve renderizar um tipo de entrada =" enviar "com uma largura fixa de 31px, enquanto o tipo de entrada =" " O texto "preenche perfeitamente o espaço restante. No entanto, no IE10, o tipo de entrada = "text" padrão teimosamente para uma largura desconcertante de 263px.

display: flex;
flex-direction: row;

O cerne do problema está na implementação parcial do IE10 da especificação do Flexbox. Ele suporta uma versão intermediária da especificação, que não possui certos recursos. Infelizmente, esses recursos ausentes impedem o layout de se comportar conforme o esperado. Para certos prefixos CSS, como -ms -flex.

use um CSS Polyfill:

Polyfills como o FlexBoxie podem imitar a funcionalidade do Flexbox no IE. . O IE pode introduzir suporte mais robusto do Flexbox. Até então, essas táticas podem ajudá-lo a navegar pelo enigma de navegador cruzado que é Flexbox no IE10.