A order
propriedade é uma subpropriedade do módulo Layout de caixa flexível.
Os itens flexíveis são exibidos na mesma ordem em que aparecem no documento de origem por padrão. A order
propriedade pode ser usada para alterar essa ordem.
Sintaxe
order: .flex-item ( order: 2; )
Demo
A demonstração a seguir mostra como a ordem padrão (1, 2, 3, 4, 5) foi alterada definindo a propriedade de pedido para cada item.
Confira esta Caneta!
Suporte para navegador
- (moderno) significa a sintaxe recente da especificação (por exemplo
display: flex;
) - (híbrido) significa uma sintaxe não oficial estranha de 2011 (por exemplo
display: flexbox;
) - (antigo) significa a sintaxe antiga de 2009 (por exemplo
display: box;
)
cromada | Safári | Raposa de fogo | Ópera | IE | Android | iOS |
---|---|---|---|---|---|---|
21+ (moderno) 20- (antigo) | 3.1+ (antigo) | 2-21 (antigo) 22+ (novo) | 12,1+ (moderno) | 10+ (híbrido) | 2.1+ (antigo) | 3.2+ (antigo) |
O navegador Blackberry 10+ suporta a nova sintaxe.
Para obter mais informações sobre como misturar sintaxes para obter o melhor suporte do navegador, consulte este artigo (CSS-Tricks) ou este artigo (DevOpera).