5.1.1.

26 junio 2005

Blogger agrega DIV clear:both a los posts

Categoría

gringo avisa que Blogger agregó una opción para corregir el problema. La nota original (en inglés) es Google Blogger adds one feature, breaks another pero para resumirla (traducida) sería:

  1. Loguearte en Blogger
  2. Opciones
  3. Formato
  4. Cambiar Enable float alignment a NO

Desde hace unos días, de manera automática, Blogger está agregando al principio y al final del texto de cada post dos elementos DIV con clear:both.

<div style="clear:both;"></div>

<!-- cuerpo del post -->

<div style="clear:both; padding-bottom: 0.25em;"></div>

Estos no pueden ser editados ni removidos y están produciendo — culpa de la loca teoria de los float — que muchos plantillas se estén rompiendo. La solución que proponen en Blogger Forum (Blogger "Clear:Both" Glitch workaround) es agregar

div { clear: none !important; }

En el mismo articulo, uno de los usuarios comenta que Blogger reconoció que se trataría de un bug y que sería corregido pronto.

Tengan en cuenta que la solución anterior es bastante drástica y puede producir aún más problemas de maquetación.

Para los que manejan mínimamente CSS hay dos soluciones más. El problema que se produce es que la columna de los posts aparece recién donde termina la barra lateral. En la mayoría de las plantillas, esta segunda columna aparece primera en el código, y por tal lo que hacen es flotarla para que luego la columna de posts se acomode.

  • Una solución es flotar la columna de los posts y definirle un ancho (lo bastante angosto como para que pueda ubicarse al lado de la otra).
    #lateral {float:left;width:40%}
    #posts {float:left;width:60%}
    
  • La otra solución sería simplemente invertir el orden en que aparecen la columna de posts y la columna lateral en el código HTML. El clear sólo tiene efecto sobre los elementos flotantes que aparecen antes en el código, por lo que la columna de posts no notaría la presencia de la lateral.

Seguramente todo este problema está relacionado con la incorporación de las opciones de imágenes en Blogger. Durante el proceso semi automatizado, está la opción de alinear las imágenes a los lados. Como seguramente Blogger automáticamente les define float, los infames DIV son una forma de asegurarse que cada post no se mezcle con las fotos de los otros.

Powered by Blogger