Emujar hacia abajo div cuya div anterior tiene float

[PosProdukcion]

Hola, en esta página, si os fijáis abajo del todo, en los enlaces de pasar de página, no consigo aplicar un margen superior que lo separe del + o del enlace INSCRIBIRSE>>.

El + o INSCRIBIRSE>> (a veces no hay +) tienen estilos float right y left, y esto es lo que aplico en after y a la div de paginación:

Código CSS:

.listaArticulos .indexExtractoArticulo /*ESTE ES TODO EL BLOQUE DE LA ENTRADILLA*/
{
    width: 380px;
    float: left;
    margin-top: 8px;
    text-align: left;
}
 
.listaArticulos .pie-articulo /*ESTE ES EL SIGNO +*/
{
    width: 380px;
    float: right;
    margin: 0 0 5px 0;
}
 
.listaArticulos .indexExtractoArticulo:after,
.listaArticulos .pie-articulo:after
{
    content: ".";
    color: white;
    clear: both;
    margin-bottom: 10px;
}
 
.listaArticulos .paginacion-index /*ESTE ES EL DIV QUE QUIERO EMPUJAR HACIA ABAJO*/
{
    display: block;
    clear: both;
    width: 380px;
    margin: 40px auto;
    text-align: center;
    border-top: 1px solid black;
    padding-top: 3px;
}
 

Este margin .listaArticulos .paginacion-index{...margin: 40px auto;...} lo ignora por completo, ¿Qué debo hacer para que se aplique?

Gracias

[ofmjuanabascal]

Tal vez el error este en el codigo HTML. Prueba a posicionar mas tarde ese div en el HTML y probablemente consigas tu objetivo.

Espero haberte ayudado. Un Saludo :)

[PosProdukcion]

El html está bien puesto, uno detrás de otro. Además, no puedo modificarlo sin que afecte al resto del sitio web.

Tengo que hacerlo con CSS.

Gracias por tu respuesta

[sanxuan]

A mí se me ocurre definir lo sigiente:

Código CSS:

.listaArticulos .paginacion-index /*ESTE ES EL DIV QUE QUIERO EMPUJAR HACIA ABAJO*/{
    display: block; /* no es necesario */
    clear: both;
    width: 380px;
    margin: 0 auto; /* uso el padding en lugar de margin para establecer la separación */
    text-align: center;
    border-bottom: 1px solid black; /* uso bottom en lugar de top */
    padding-top: 40px; /* esta es la separación con respecto a + */
}
.paginacion-index a {
    color: black;
    margin: 30px 2px 0; /* 30px es la separación con respecto al borde de separación*/
    text-decoration: none;
}
 

Sólo lo he comprobado en Firefox. Sería buena idea comparar el resultado en otros navegadores antes de cantar victoria.

[kseso?]

¿El enlace que quiere separar es el que aparece como />>/?
Si es así, aumente el valor del margen superior de
.

Código CSS:

paginacion-index a {
    color: black;
    margin: 0 2px;
    text-decoration: none;
}
 

Edito:
Vaya, parece que estuve algo lento.