[Ovillo] Bug al hacer un :after { clear:left; } en IE7

Nicolas Cohen nicolas en smileandsoft.com.ar
Mie Sep 27 15:13:32 UTC 2006


Recién encontre una solucion a un pequeño problemin de render en IE7  
(claro que si : )

Si uds son como yo, no les gusta agregar esos horribles <div  
class="clear">&nbsp;</div> luego de objetos cuyos elementos internos  
son todos flotados. Para esto usamos la hermosa pseudo-clase :after  
con una regla como esta:

.flotandentro:after {
	content:' ';
	display:block;
	width:1px;
	height:1px;
	clear:left;
}

como IE6 le hace clear a todos los objetos igual, nos funciona  
perfecto... hasta que llego IE7, en el RC1 aun no habia caso, no le  
hace caso al after a los elementos que no tengan un ancho o alto  
especificado (lo cual en varios casos eliminaria el beneficio del  
clear, y de que floten)

pues bien, si agregan lo siguiente:

.flotandentro {
min-height:1px;
}

el IE7 ya renderea bien el :after y todo vuelve a su orden. Ademas  
poner un min-height de 1px es poco probable que vaya a afectar como  
se dibuja su template!

espero que les sirva!

Nicolas Cohen
Smile&Soft







Más información sobre la lista de distribución Ovillo