CÓMO AÑADIR UN BORDE ALREDEDOR DE LA COLUMNA EN BLOGGER

Lo advierto, hay blogs que quedan mejor sin el pero si te gusta y consideras que tu blog es menos soso con esto pos se lo pones y listo. Yo sólo te lo digo por si no quieres tener un blog muy recargado. 

Te lo voy a explicar paso por paso para que no te pierdas:

• Plantilla
• Editar HTML
• Y buscas pulsando (ctrl + f) (dentro del cuadro de los códigos, no fuera)

content-outer

Un poco más abajo verás que pone:

margin-bottom: 1px;
}

Esto sería un ejemplo, no es el definitivo. Sólo te digo que son en total 4 líneas pero no te apures, que es muy fácil.

border-right: 7px solid #000000

Ahora te lo explicaré paso a paso para que lo entiendas y puedas hacer tu misma tu código.

Quiere decir que me va a salir una línea de 7px de ancho en la derecha de la columna y en color negro.

1) border-right:

Significa obviamente que es el borde de la derecha.

En las siguientes líneas, una detrás de otra, deberías ir añadiendo los siguiente bordes.

Como la primera dice right (derecha).
La siguiente línea será igual pero diciendo left (izquierda).
La siguiente top (superior) - aunque si tienes barrita de Blogger arriba no hace falta.
Y la siguiente bottom (inferior).

2) 7px

Es el ancho de la línea. Obviamente cuanto mayor sea el número que le pongas, más gordita se verá la línea y viceversa.

3) solid

Quiere decir que es una línea sólida. Puedes cambiar esto por otras cosas.

En realidad se pueden poner bastantes cosas, pero yo recomiendo que si vas a poner un borde sea:

solid (línea lisa)
dashed (con guiones)
dotted (con puntitos)
double (doble)

4) #0000000

Es el color de la línea. Esto ya lo conoces. Y ya he explicado en post anteriores cómo saber el color que quieres. No lo repito porque es un tostón repetir siempre lo que ya he explicado varias veces. No te lo tomes a mal pero tienes que comprender que después de haberlo mencionado varias veces yo pienso que ya deberías saber cómo se hace.

Esto sería un modelo ya hecho. Ay, pillinas ;) cómo sé que algunas no os habéis enterado y que queréis un modelo para copiar y modificar a vuestro gusto. Pos no pasa nada porque aquí está vuestra solución.

border-right: 3px solid #fdb8b6;
border-left: 3px solid #fdb8b6;
border-top: 3px solid #fdb8b6;
border-bottom: 3px solid #fdb8b6;

No quites los puntos y comas porque si no el código no vale nada y no te sale.

Puedes ir probando diferentes combinaciones e ir dando a Vista previa hasta que tengas el reborde como te guste.

• Y una vez que ya te has decidido le das a guardar plantilla y listo.

Como ves es increíblemente fácil tener un diseño bonito y con apariencia profesional una vez de que has aprendido los básicos.

Besos,