Posts guardados en "css":

El widget que no se acomoda.

Algunas veces mientras añadimos widgets (gadgets, cosas) a nuestro blog, notamos que queda mal alineado o nos gustaría subirlo o bajarlo un poco. Pues en este post les diré como hacerlo.

1. Ingresamos a Blogger y vamos a ‘Diseño’, identificamos el widget problemático y ponemos el puntero encima de ‘Editar’. Nos fijamos en la parte de abajo del navegador en la dirección que nos muestra.


Haz clic en la imagen para verla en tamaño completo.

Después de widgetID= está el nombre de nuestro widget. En este caso el nombre es “HTML2″.

2. Vamos a ‘Edición HTML’, el siguiente código lo ponemos en la parte CSS de la plantilla. Si no sabes que es eso, pues ponlo justo antes de ]]>.

#HTML2 {

}

Sustituyendo claro, el “HTML2″ por el nombre que obtuvimos en el paso 1.

3. Para poder mover el widget, necesitamos algo que se llama padding. Suponiendo que queremos bajarlo un poco, entonces ponemos esto:

#HTML2 {
padding-top: 10px;
}

Si queremos subirlo sería padding-bottom, derecha e izquierda es padding-right y padding-left respectivamente.

Lógicamente, si queremos moverlo más aumentamos los pixeles (20px, 45px, 7px). Ahora es solo cuestión de probar y mover hasta que nos guste el resultado.

Ahora, supongamos que queremos moverlo hacia abajo y a la derecha, nos quedaría algo así:

#HTML2 {
padding-bottom: 10px;
padding-right: 25px;
}

Para ahorrar un poco de código lo podríamos resumir así:

#HTML2 {
padding: 0 0 10px 25px;
}

Podemos incluir las cuatro ‘direcciones’ en un solo padding en este orden: arriba izquierda abajo derecha. Ponemos ceros en los que no queremos utilizar.

Eso es todo, espero que les sea de utilidad.