Ver Mensaje Individual
  #2 (permalink)  
Antiguo 23/12/2011, 02:14
Avatar de dual3nigma
dual3nigma
Colaborador
 
Fecha de Ingreso: febrero-2010
Ubicación: Ciudad de México
Mensajes: 295
Antigüedad: 14 años, 2 meses
Puntos: 122
Respuesta: Si ya no se usa floats, ahora que?

Hola Ulisess, Dejame adivinar quien dijo eso: freddier, es la clase de afirmaciones que suele hacer xD, para empezar con html5 (mas bien CSS3) no sustituiremos a los floats por display inline, sino por el flexible Box model. Mira este ejemplo:

Código HTML:
Ver original
  1. <!doctype html>
  2.  
  3.  
  4. body {
  5. display:-webkit-box;
  6. }
  7.  
  8. div {
  9. width:200px;
  10. height:200px;
  11. background:red;
  12. margin:5px;
  13. }
  14. </head>
  15.  
  16.  
  17. <div></div>
  18. <div></div>
  19. <div></div>
  20.  
  21. </body>
  22. </html>


Prueba lo en cualquier navegador webkit, las cajas deberían salir "flotando" a la izquierda, con este método puedes elegir la orientación con "-webki-box-orient" que por default es horizontal, y tienes propiedades para que estas cajas se centren tanto horizontal como verticalmente: -webkit-box-pack: center, -webkit-box-align: center. Estas propiedades también admiten los valores "start" y "end" que hacen que las cajas se alineen a la izquierda o derecha, arriba o abajo. Juega un poco con los valores y veras, display inline es algo que todos hemos usado en algunos casos, por que no funciona en ie7, por ejemplo para los famosos menús listas horizontales, pero para nada sustituirán los floats. Espero mi explicación sea clara, sino pregunta y pongo mas ejemplos.

Saludos.