Propriedade Style flexDirection

Definição e Uso

flexDirection Define ou retorna a direção do item flexível.

Notas:Se o elemento não for um item flexível, então flexDirection Propriedade inválida.

Veja também:

Manual de Referência CSS:propriedade flexDirection

Exemplo

Reorganizar a direção dos itens flexíveis dentro do elemento <div>:

document.getElementById("main").style.flexDirection = "column-reverse";

Experimente você mesmo

Sintaxe

Retornar a propriedade flexDirection:

objeto.style.flexDirection

Definir a propriedade flexDirection:

objeto.style.flexDirection = "row|row-reverse|column|column-reverse|initial|inherit"

Valor da propriedade

Valor Descrição
row Valor padrão. Os itens flexíveis são exibidos horizontalmente, como uma linha.
row-reverse Igual a row, mas na ordem inversa.
column Os itens flexíveis são exibidos verticalmente, como uma coluna.
column-reverse Igual a column, mas na ordem inversa.
initial Defina essa propriedade como seu valor padrão. Veja initial.
inherit Herda essa propriedade do elemento pai. Veja inherit.

Detalhes Técnicos

Valor padrão: row
Retorno: String que representa a direção do elemento propriedade flexDirection.
Versão do CSS: CSS3

Suporte do Navegador

Os números na tabela indicam a versão do navegador que suporta completamente essa propriedade.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Suporte 11.0 Suporte 9.0 Suporte

Páginas Relacionadas

Manual de Referência do DOM STYLE HTML:flex

Manual de Referência do DOM STYLE HTML:flexBasis

Manual de Referência do DOM STYLE HTML:flexFlow

Manual de Referência do DOM STYLE HTML:flexGrow

Manual de Referência do DOM STYLE HTML:flexShrink

Manual de Referência do DOM STYLE HTML:flexWrap