Enmarcar entradas y gadgets

Algunas veces las plantillas suelen ser muy "planas" y nos hacen sentir como que los gadgets o las entradas se pierden entre ellos mismos pues no se distingue dónde empiezan y dónde acaban.
Así que una opción para delimitar los espacios de éstos es enmarcar las entradas y gadgets del blog y así definir cada uno con un borde. Por supuesto que podemos elegir si se lo aplicamos sólo a las entradas, o únicamente a los gadgets.

Haremos que las entradas se vean más o menos así.


Y los gadgets así.


Veamos pues cómo enmarcar entradas y gadgets tanto en las plantillas "nuevas" como en las "antiguas" de Blogger. Para cualquiera de las dos entra en Plantilla | Edición de HTML, y ahora...


Antes de ]]></b:skin> agrega esto:

.post-outer {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:15px;
margin: 20px 0;
}

.column-right-outer .widget, .column-left-outer .widget {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:10px;
margin: 10px 0;
}

.footer-inner .widget {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:10px;
margin: 10px 0;
}

El tamaño, tipo y color del borde se modifica en border: 1px solid #000;
También puedes elegir que los bordes sean redondeados, sólo cambia los valores en color azul por unos más altos, por ejemplo 10px entre más alto sea el valor más redondeadas serán las esquinas.


En el caso de algunos diseños de las plantillas Awesome Inc y Ethereal en lugar del primer bloque, el que utilizaremos será este:

.date-outer {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:15px;
margin: 40px 0;
}

Antes de ]]></b:skin> agrega esto:

.post {
border:1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
}
.main .post {margin:20px 0; padding:15px;}

.sidebar .widget {
border:1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
margin:15px 0;
padding: 10px;
}

.footer .widget {
border:1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
margin:15px 0;
padding: 10px;
}