Richard Barros

Flutuar um objeto à esquerda ou à direita com a propriedade Float é um conceito primário na criação de layouts em CSS, mas não existe nenhuma implementação que permita fazer o Float: Center.

A idéia pode parecer estranha, mas em diagramação de jornais e revistas, por exemplo, é muito comum ter imagens entre dois blocos de texto, como se estivessem flutuando bem no meio. Porque não é possível no CSS?

O designer Trevor Davis se fez a mesma pergunta e publicou em seu blog o artigo Why is there no float: center? [en] com alguns exemplos de como simular um efeito de float centralizado em páginas CSS:

• Para o primeiro exemplo funcionar, ele colocou as duas colunas de texto separadas e a imagem ficou na primeira coluna com float:right e uma margem negativa correspondente à metade de sua largura.
• No segundo exemplo ele flutuou a imagem com position: absolute e afastou os caracteres usando espaçamento manual de fontes como Courier e Monospace.

Mesmo sendo soluções na base de gambiarras - simulação de efeito -, para este caso específico parecem funcionar muito bem.

Para montagem de layouts, no entanto, não há boas notícias. Não existe float:center no CSS e todo tipo de diagramação de sites continuará sendo feita usando apenas os floats left e right.