Hola de nuevo:
Pues casi lo tengo y está casi solucionado, pero ahora me ha salido un problema nuevo. Al lado de los títulos hay un bloque con otro class (estrellas) y no me lo coloca seguido del título. Sólo cuando es 1 línea, si son 2, lo deja a la derecha del todo. Es como si todas las propiedades del flex las aplicase sólo al div del título. Es más, si en php muevo el </a> después del class de "nota_index", entonces si los alinea, pero claro, me interpreta las estrellas como si pertenecieran al enlace. (Lo he dejado así para que veas a qué me refiero)
Aquí están los nuevos CSS
Código:
.preview_image {
display: block;
position: relative;
width: 300px;
height: 150px;
}
.preview_data {
text-transform: uppercase;
font-family: 'Francois One', sans-serif;
font-size: 9px;
word-spacing: -1px;
letter-spacing: 1px;
display: block;
width: 300px;
height: auto;
overflow: hidden;
background-image: url('../images/post_title_bg2.png');
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
.archive_title {
text-align: left;
font-family: 'Francois One', sans-serif;
word-spacing: -2px;
text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000;
height: 217px;
width: 293px;
display: inline-flex;
flex-direction: row;
align-items: center;
align-content: left;
margin-left: 4px;
flex-wrap: nowrap;
}
.archive .post-categories {
float: left;
margin: 0px 0px 0px 0p
}
.nota_index {
font-style: normal;
font-size: 14.5px;
letter-spacing: 0px;
color: #ffbb00;
margin-left: 4px;
margin-left: 4px;
vertical-align: 1px;
El php no ha cambiado nada.
Muchas gracias y un saludo.