viñetas diferentes en ie que firefox

peconrrixico22 · #1 (**permalink**) 27/05/2009, 02:27

Me estoy volviendo loco tengo unas viñetas y se ven diferentes en firefox que en iexplorer ..

Firefox

Explorer

el codigo:

ul {
padding-left: 0; /*Limpieza de márgenes (se puede cambiar)*/
margin-left: 25px; /*Indentado de la lista (se puede cambiar)*/
list-style-type: none; /*Quitar estilo de viñeta*/
}

ul li {
padding-left: 18px;
background: url(/images/vineta.gif) 0em 0.3em no-repeat;
margin-bottom: 0.5em;
text-align:left;
min-height:20px;
background-color:red;
}

¿A que se debe?

Gracias.

hades87 · #2 (**permalink**) 27/05/2009, 02:29

margin-bottom: 0.5em;

ahí en vez de 0.5 ponle un valor entero, sin coma. Ya que yo tuve problemas por eso mismo y me salían distintos, prueba con 1 em, o cambia el tamaño a px

peconrrixico22 · #3 (**permalink**) 27/05/2009, 02:37

Gracias, asi mejora .. pero sigo sin poder ajustar la imagen personalizada para el punto, debido que en internet explorer siempre esta mas arriba que en firefox ...

talmente · #4 (**permalink**) 27/05/2009, 03:03

Hola, prueba a resetea ul y li

Código:

margin: 0px;
padding: 0px;

peconrrixico22 · #5 (**permalink**) 27/05/2009, 03:29

Nada sigue igual en explorer siempre esta mas arriba la imagen ..

hades87 · #6 (**permalink**) 27/05/2009, 05:30

y si pruebas a quitar el margin-bottom?

kseso? · #7 (**permalink**) 27/05/2009, 05:53

Posiblemente sea debido a la posición del fondo:

Cita:

background: url(/images/vineta.gif) 0em 0.3em no-repeat;

cambia a una unidad absoluta (px) para hacer la prueba, y quizás te convenga ajustar también el valor para "line-height".

Como último recurso puedes aplicar un comentario condicional para corregir esa posición.

Y si estás hablando de ie6, recuerda que no reconoce los "min/max".

Un saludo

peconrrixico22 · #8 (**permalink**) 28/05/2009, 02:15

Lo de los valores absolutos lo he probado y nada .. mejora el aspecto pero sigue igual, el line-height hace mejorar tambien el aspecto pero no queda aun perfecto.

¿como se aplican condicionales en css? ¡¡ Perdonen mi ignorancia !!

hades87 · #9 (**permalink**) 28/05/2009, 02:33

Mira, es tan fácil como buscar un poco por eso que llaman google y encuentras la solución

jomaruro · #10 (**permalink**) 28/05/2009, 15:06

Hola:

Prueba a ponerlo así:

Código:

margin-bottom: x !important;
margin-bottom: y;

siendo x el valor del margin-bottom que necesites en firefox e y el valor que necesites en IE.

Esto hará que FF le de prioridad a ese margin-bottom (el marcado con !important), IE no reconoce el important con lo que el valor del segundo margin-bottom anulará el primero.

Saludos.

peconrrixico22 · #11 (**permalink**) 08/06/2009, 01:25

Jomaruro, muchas gracias por ese gran truco.

Y gracias a todos en general, formamos una buena comunidad.

jomaruro · #12 (**permalink**) 09/06/2009, 13:40

Hola:

De nada, me alegro de que te haya servido.

Saludos.