Ordem de quebra dos float

[rikaschmitt 54]

Boa tarde.

 

O conteúdo do site é dividido em blocos, e esses blocos são organizados com float:left, ficando um ao lado do outro. Estou usando um grid responsivo, e quando chega em uma determinada resolução, esses blocos perdem o float, então um fica embaixo do outro.

 

O problema é que a ordem dos blocos segue o padrão de 1..2..3..4.. mas eu precisava mudar essa ordem.

 

Exemplo:

 

 

A ordem que acontece é a (1) e eu preciso da (2), pois o site estrutura-se mais ou menos assim:

 

[ imagem ] [ texto ]

[ texto ] [ imagem]

 

Então, quando perde os floats, fica:

 

[ imagen ]

[ texto ]

[ texto ]

[ imagem]

 

e eu preciso de:

 

[ imagem ]

[ texto ]

[ imagem ]

[ texto ]

 

 

Como lidar? rs

[William Bruno 1501]

O truque é vc inverter os floats, e deixar a ordem do html na ordem que vc quer.

 

[ imagem float: left ]

[ texto float: right ]

[ imagem float: right ]

[ texto float: none ]

 

o resultado será:

[ imagem ] [ texto ]

[ texto ] [ imagem]

 

E quando perder o float, estará na ordem que vc quer.

imagem

texto

imagem

texto

[rikaschmitt 54]

Não funcionou direito.

Estou usando seu grid para orientar os blocos (cada um usando a column-half").. Mas deixa pra lá, vou tentar fazer de outra maneira.