Imagen de background.. no funciona ni con IE6 ni IE7

[pablogarces]

Hola a todos. Espero que alguien pueda echarme un cable porque no debe ser complicado... pero no tengo ni idea de cómo poder solucionar este fallito.

Estoy añadiendo en la parte superior de cada post un navegador para el post siguiente y anterior, y bueno, cuando el nombre es más largo de lo normal, Firefox lo muestra bien, sin que se pise el texto y el icono de flecha... pero Internet Explorer se lo come con patatas



Aquí con Firefox



Aquí con Internet Explorer 7. Con el IE 6 sucede lo mismo.

Os añado por ejemplo parte del código CSS.

.navigation2 .next a {
background: url('img/next.gif') no-repeat center right;
padding: 0 16px 0 0;
}

Saludos y gracias desde ya al que pueda echarme un cable.

[showlnx]

Prueba con cambiar el center por top así, aunque de todas formas me da la sensación de que ese CSS es de la felcha de la derecha:

Código:

.navigation2 .next a {
background: url('img/next.gif') no-repeat top right;
padding: 0 16px 0 0;
}

Si se te sigue viendo mal -la flecha demasiado arriba- o tengo razón y ese es el de la derecha, pon el código de nuevo y hablamos.

Saludos crack

[pablogarces]

Hola crack, gracias por responderme.

#navigation2 {
font-size: .8em;
}

.headernav {
padding: 0 0 20px 0;
}

.navigation2 .next {
float: right;
width: 45%;
text-align: right;
}

.navigation2 .next a {
background: url('img/next.gif') no-repeat top right;
padding: 0 16px 0 0;
}

.navigation2 .prev {
float: left;
width: 45%;
text-align: left;
}

.navigation2 .prev a {
background: url('img/prev.gif') no-repeat top left;
padding: 0 0 0 16px;
}

.navigation2 a {
text-decoration: none;

Ese es el código completo.

He cambiado como ves center por TOP, y se ve así:



Aunque parecía que todo había mejorado (aunque las flechas y el texto están a alturas diferentes ), cuando el post largo viene por el otro lado se muestra así, a no ser que sea un problema mío de caché, que no creo porque he mirado desde dos ordenadores y quitando el wp-cache.



:(

[showlnx]

Ok, lo de la altura:

Código:

.navigation2 .prev a {
background: url('img/next.gif') no-repeat 0 5px;
padding: 0 0 0 16px;
}

Es cuestión de ir jugando con esos dos tamaños de pixels -puede que hasta vayan al revés- y lo de la derecha, así en frío sin poder probar nada -no tengo IE en Mac- ni idea.

[pablogarces]

Coñe, parece que la cosa va mejorando con eso de 0 5px... qué debería poner en el otro lado, para el next?

gracias de verdad tio.