domingo, 7 de marzo de 2010

Modificar el ancho total del blog

 Para modificar el ancho total de un blog de Blogger, hay que buscar en la plantilla las líneas de código donde están los encabezados #header-wrapper (/* Header */), #outer-wrapper (/* Outer-Wrapper */) y #footer (/* Footer */); a sus respectivas propiedades width hay que añadir un mismo valor de longitud en píxeles.

 En este ejemplo, he añadido un valor de 980 píxeles (un valor óptimo para una resolución de 1024x768):
#header-wrapper {
  width: 980px;
  margin: 0 auto;
  border: 0;
}
#outer-wrapper { 
  width: 980px;
  margin: 0 auto;
  padding: 0;
  text-align: justify;
  font: $bodyfont;
  border: 4px ridge #3399cc;
  background: #c3d9ff;
}
#footer {
  width: 980px;
  height: 122px;
  clear: both;
  margin: 0 auto;
  padding-top: 0;
  line-height: 1.6em;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  text-align: center;
  background-image: url(http://img411.imageshack.us/img411/6596/silverolusplater04awu8.jpg);
}
 En el anterior ejemplo se puede observar que las definiciones principales del pie del blog (o footer) están encabezadas por #footer; esto no es razonable, así que es preferible dividir las propiedades entre #footer-wrapper y #footer, como puede verse en el siguiente ejemplo:
#footer-wrapper {
  width: 980px;
  height: 122px;  
  clear: both;  
  margin: 0 auto;
  background-image: url(http://img411.imageshack.us/img411/6596/silverolusplater04awu8.jpg);  
}

#footer {
  width: 100%;
  padding-top: 0;
  line-height: 1.6em;
  letter-spacing: 0.1em;
  text-align: center;
  text-transform: uppercase;
}


----------------------------------------------------------------------------------------------------------------------------------------------------------

No hay comentarios: