sábado, 23 de noviembre de 2013

Elementos HTML con float escapan de su contenedor padre.

Cuando usas la propiedad CSS "float" en algunos elementos estos salen del flujo normal del documento y provoca que los mismos salgan de su contenedor padre. Muchos blogs recomiendan insertar un elemento HTML con la propiedad "clear:both" después de los elementos para resolver el problema. Hoy hice una pequeña recopilación de como resolver este problema de 3 maneras distintas, en el siguiente ejemplo.



La verdad que en la tercera opcion funciona correctamente pero no logro entender el por que. La que mas me ha gustado es la segunda opcion usando :after de css3 .

Link para leer un poco sobre block formatting; http://www.yuiblog.com/blog/2010/05/19/css-101-block-formatting-contexts/

Link: http://html5hub.com/after-float/#i.685flmb6repov7


No hay comentarios:

Publicar un comentario