Foros del Web » Creando para Internet » CSS »

Error con CSS y <li> en Firefox

Estas en el tema de Error con CSS y <li> en Firefox en el foro de CSS en Foros del Web. Buenas.. estoy haciendo un menu con las etiquetas <ul> <li>, el codigo que tengo es el siguiente: Código HTML: <ul> <a href= "#" > <li> ...
  #1 (permalink)  
Antiguo 18/04/2009, 02:22
agd
 
Fecha de Ingreso: mayo-2008
Mensajes: 98
Antigüedad: 9 años, 7 meses
Puntos: 2
Error con CSS y <li> en Firefox

Buenas.. estoy haciendo un menu con las etiquetas <ul> <li>, el codigo que tengo es el siguiente:

Código HTML:
<ul>
  <a href="#">
    <li>
      Inicio
    </li>
  </a>
 <a href="#">
    <li>
      La empresa
    </li>
  </a>
 <a href="#">
    <li>
     Contacto
    </li>
  </a>
</ul> 
y en el CSS le doy "forma" al menu.. el problema es que con firefox me aparece como si hubiera hecho el codigo de la siguiente manera:

Código HTML:
<ul>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
  <a href="#">
    <li>
      Inicio
    </li>
  </a>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
 <a href="#">
    <li>
      La empresa
    </li>
  </a>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
 <a href="#">
    <li>
     Contacto
    </li>
  </a>
<a href="#">
    <li>
                      <-- Espacio en blanco
    </li>
  </a>
</ul> 
es decir me crea un <li> vacio sobre y debajo de uno que yo haya creado.. en Google Chrome funciona perfecto..

Espero que alguien sepa cual es el error y me lo pueda decir :)

Muchas Gracias
__________________
http://clanofhaunted.com
  #2 (permalink)  
Antiguo 18/04/2009, 03:05
Avatar de YamilG  
Fecha de Ingreso: junio-2008
Ubicación: Tegucigalpa, Honduras
Mensajes: 10
Antigüedad: 9 años, 5 meses
Puntos: 0
Respuesta: Error con CSS y <li> en Firefox

En teoría lo que debería tener el link (anchor) debería ser el elemento de texto que está dentro de las listas, probá hacer lo siguiente:

En vez de tener esto:
Código HTML:
<ul>
  <a href="#">
    <li>
      Inicio
    </li>
  </a>
</ul> 
anidalo de la siguiente manera:

Código HTML:
<ul>
  <li>
     <a href="#">Inicio</a>
  </li>
 </ul> 
Éxitos
  #3 (permalink)  
Antiguo 26/04/2009, 15:05
 
Fecha de Ingreso: abril-2009
Mensajes: 1
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: Error con CSS y <li> en Firefox

Buscando un error similar a este vine a dar con este foro, mil gracias! no podía encontrarle la vuelta
  #4 (permalink)  
Antiguo 27/04/2009, 10:58
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: Error con CSS y <li> en Firefox

Saludos!!

Efectivamente, la solucion es esa, pero... porque?

Sencillo: la etiqueta <a> (al igual que img, span, etc...) son elementos de linea y otras etiquetas como <div> (div, h1, h2, li, etc...) son elementos de bloque. La diferencia entre ambos es que los elementos de bloque ocupan una linea, por lo que al poner otro elemento, este aparecerá como si hubiera un salto de linea (o muchos espacios, en este caso) y los elementos de linea, aparecen uno a el lado de otro sin necesidad de hacer saltos de linea.

Segun el estándar XHTML, Un elemento de bloque, puede contener elementos de linea y de bloque, pero los elementos de linea solo pueden contener otros elementos de linea.

Espero haberme explicado... Hasta Luego!!

PD: Referencia: Elementos de Bloque vs Elementos de linea
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:49.