Mozilla esta loco

[nevermind2403]

Hola a todos como estan? Estoy subiendo esta pagina y tengo un grave problema, en chrome se me ve muy bien pero Mozilla Firefox se me desplaza el menu,el problema surgio en el momento que introduje la linea list-style-position:inside,he puesto el prefijo del motor de mozilla -moz- y nada, aun si alguien me puede dar una mano muy agradecido.

Aca esta la pagina:

www.lceventos.com.ar/pruebacandelaria

Si tambien alguien sabe como personalizar el scroll en mozilla como lo tengo en chrome o algun tuto o data de como personalizar el scroll en mozilla se los agradezco,saludos

[Zeromm]

poner "bullets" con las listas, además de que da muchos problemas, es más "complejo" de trabajar.

Posiblemente la mejor opción es ponerlos con pseudo-elementos. En este caso yo le pondría un pseudo-elemento before, y dentro le metería en un "content" la imagen que quieres poner y la posicionaría justo donde necesitas. Así seguro que no te da problemas :)

[pzin]

Por lo visto es un bug de Firefox. Por aquí hay una solución temporal: http://jsfiddle.net/6ghpt/2/

Edito: No cambies de color las barras de desplazamiento, es una cosa bastante antiestética hacerlo y estás cambiando las herramientas básicas de cada usuario, por no decir que luego se verán diferentes de todas formas según navegador y sistema operativo.

[nevermind2403]

Iniciado por pzin

Por lo visto es un [URL="https://bugzilla.mozilla.org/show_bug.cgi?id=36854"]bug[/URL] de Firefox. Por aquí hay una solución temporal: [url]http://jsfiddle.net/6ghpt/2/[/url]

Edito: No cambies de color las barras de desplazamiento, es una cosa bastante antiestética hacerlo y estás cambiando las herramientas básicas de cada usuario, por no decir que luego se verán diferentes de todas formas según navegador y sistema operativo.

Gracias por tu opinion amigo y solucion, es que me lo pidio un diseñador, y hay que hacerlo asi, realmente he buscado y no he encontrado nada sobre como personalizar la barra de scroll en firefox, gracias por la data

Iniciado por Zeromm

poner "bullets" con las listas, además de que da muchos problemas, es más "complejo" de trabajar.

Posiblemente la mejor opción es ponerlos con pseudo-elementos. En este caso yo le pondría un pseudo-elemento before, y dentro le metería en un "content" la imagen que quieres poner y la posicionaría justo donde necesitas. Así seguro que no te da problemas :)

No entendi mucho a que te referis con "bullets"(perdon por mi ignorancia).

Tampoco entendi para que utilizariamos el before, por ej ,este menu es simple

Código HTML:

<div>
    <ul>
       <li><a></a></li>
      <li></a> </a></li>
.....
  </ul>
</div>
 

Donde las ul tienen adentro list-type-imagen y list-position:inside

y adentro de las <a> tienen un padding para q aperezcan a un costado , para q el hover tome todo la li (ya que con margin o padding en otro elemento no permite tomar todo el hover)

Espero haberme explicado mejor, gracias por tu respuesta si tienes algun ejemplo de lo que me dices te lo agradeceria,saludos

[Zeromm]

Los bullets (tambien llamados boliches y de otra forma más que nunca me acuerdo xD) son los elementos que van delante de un texto a modo de lista. En tu web los bullets serían esos iconos que pones delante de caada menú (empresa, catering... etc etc...)

Te pongo un ejemplo de como hacer lo que te comento

http://graficaspelufo.com/

Esa web la maqueté hace cosa de un mes, y si te fijas en el menú superior que aparece a la derecha, delante de "aviso legal" aparece el icono de una marca de registro, que sería su bullet.

Ese <li> tiene el siguiente código

#menuSecundario li:before {
content: url("../img/marcaCorteGris.png");
margin-left: -25px;
position: absolute;
top: 29px;
}

Es decir, justo antes de ese li "li:before", ponme la imagen que meto dentro de "content". Lo bueno de ponerlo de esta forma es que tienes total control sobre donde y como quieres poner el bullet, como te comenté si pones los bullets con los "list-style-image" es mucho más costoso modificar su posición, además del error que te produce en firefox.

[nevermind2403]

Iniciado por Zeromm

Los bullets (tambien llamados boliches y de otra forma más que nunca me acuerdo xD) son los elementos que van delante de un texto a modo de lista. En tu web los bullets serían esos iconos que pones delante de caada menú (empresa, catering... etc etc...)

Te pongo un ejemplo de como hacer lo que te comento

[URL="http://graficaspelufo.com/"]http://graficaspelufo.com/[/URL]

Esa web la maqueté hace cosa de un mes, y si te fijas en el menú superior que aparece a la derecha, delante de "aviso legal" aparece el icono de una marca de registro, que sería su bullet.

Ese <li> tiene el siguiente código

#menuSecundario li:before {
content: url("../img/marcaCorteGris.png");
margin-left: -25px;
position: absolute;
top: 29px;
}

Es decir, justo antes de ese li "li:before", ponme la imagen que meto dentro de "content". Lo bueno de ponerlo de esta forma es que tienes total control sobre donde y como quieres poner el bullet, como te comenté si pones los bullets con los "list-style-image" es mucho más costoso modificar su posición, además del error que te produce en firefox.

Mil gracias hermano sos un groso y muy buena persona por ayudarme,ojala te pueda devolver el favor algun dia, lo solucione al toque con este tip, te agradezco de mil favores.

Te hago una consulta sabes como se puede personalizar el scrollbar en firefox?

[Zeromm]

Nada hombre, esto es un foro para ayudarnos todos mutuamente :)


Sobre lo del scroll...

Hasta donde yo se no se puede hacer. Y si se puede hacer (que insisto creo recordar que no se puede) requiere de muchisimo javascript

[pzin]

Antiguamente podía hacerse, no sé si algún navegador mantiene esa horrible posibilidad. Pero lo dicho, lo habitual es no cambiar las cosas del sistema.