Personalizar la fecha de las entradas de Blogger

He estado "jugando" en mi block de pruebas un rato y he modificado de forma simple la apariencia de la fecha de las entradas:

En el HTML de la plantilla, en la parte del CSS, está: h2.date-header {, esta parte es la fecha de las entradas, normalmente se ve así:

h2.date-header {
margin:1.5em 0 .5em;
}

Yo le he añadido algunos valores, hasta encontrar el efecto que quería, y me ha quedado así:

h2.date-header {
margin:1.5em 0 .5em;
width: 100px;
text-align:center;
text-transform:uppercase;
border: solid #000000 1px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
background: #c0ffff
}

Os explico lo que he hecho:

width: 100px; esto hace que el tamaño del borde que añadiré luego tenga el tamaño que quiero, si no lo ponemos el borde se adaptará al tamaño de la entrada.

text-align:center; esto hace que el texto esté en el centro del borde.

text-transform:small; para que el texto se vea en mayúsculas, si cambiamos uppercase por small se verá en minúsculas.

border: solid #000000 1px; el color y grosor del borde, si aumentas 1px, se verá mas grueso y si cambias #000000 se verá del color que quieras.

-moz-border-radius: 15px;
-webkit-border-radius: 15px; esto hará que los bordes se vean redondeados.

background: #c0ffff esto es el color del fondo, podéis cambiarlo por el vuestro.

Y este ha sido el resultado:




Si lo que estáis buscando es ocultar la fecha de las entradas, olvidaros de lo anterior y simplemente añadis en h2.date-header {
margin:1.5em 0 .5em;
}
esta línea:

visibility:hidden;

Compartir Enlace