viernes, 28 de noviembre de 2008

Ampliación de la amplitud del blog

Es ésta la primera práctica que hago de CSS y de HTML.
CSS significa Cascade Style Sheets u Hojas de Estilo en Cascada. El CSS de cualquier blog está entre las etiquetas "b:skin-apertura" y "/b:skin-de cierre". Se caracterizan por empezar por el símbolo #.
En cambio las líneas para modificar o añadir algún elemento están entre las etiquetas body-apertura y body-cierre de etiqueta.
En resumen, hemos modificado la plantilla Mínima de Blogger, haciendo lo siguiente:
1.-Hemos definido mejor el footer y hemos cambiado lo que sigue

#footer {
clear: both;
margin: 0 auto;
padding-top: 15px;
line-heigth: 1.6em;
text-transform: uppercase;
letter-spacing: .1em;
text-align: center;
width: 660px;
}

por esto otro, mejor definido en la estructura lógica del blog:

#footer-wrapper {
clear: both;
margin: o auto;
width: 660px;
}

#footer {
letter-spacing: .1em;
line-heigth: 1.6em;
padding-top: 15px;
text-align: center;
text-transform: uppercase;
}

Después, agregamos esto para que también quede definido el content-wrapper:

#content-wrapper {
position: relative;
width: 100%;
}

Y añadimos lo siguiente para que la navbar desaparezca:

#navbar {
display: none;
heigth: 0;
visibility: hidden;
}

Después de definir correctamente todo lo anterior, lo que queremos hacer es aumentar el contenido de los contenedores del blog, así:

#outer-wrapper {
width: 980px; /*cambiamos 660 por 980*/
}
#header-wrapper {
width: 980px; /*cambiamos 660 por 980*/
}
#footer-wrapper {
width: 980px; /*cambiamos 660 por 980*/
}

Ahora también debemos trasladar los 320 píxeles de más al contenedor de post y al de la sidebar:

#main-wrapper {
width: 560px; /*410+150=560*/
}
#sidebar-wrapper {
width: 390px; /*220+170=390*/
}

El resultado final que es el que ahora se puede ver en el blog Tester, es la misma estructura, pero aprovechando mejor el espacio en la ventana del monitor.

Bueno, para ser la primera práctica, no ha estado nada mal el resultado.

martes, 25 de noviembre de 2008

Creación del Andybel-Tester

Ante la creciente demanda por mi parte de adquirir conocimientos de CSS y HTML para poder literalmente "tunear" mis blogs de referencia, he decidio crear este "Andybel-Tester" como blog de pruebas y donde realizaré cambios de plantillas y las destriparé, para poder por fin aprender algo en esto de la personalización y optimización de los blogs.
Bueno, Tester, aquí te dejo empezando esta nueva etapa mía de bloguero que espero que me lleve a nuevos horizontes de conocimiento y también de satisfacción.