Foros del Web » Creando para Internet » CSS »

Alguien sabe por qué se me desplazan los <li> estos?

Estas en el tema de Alguien sabe por qué se me desplazan los <li> estos? en el foro de CSS en Foros del Web. hola! si quieren mirar aqui http://keepyourlinks.byethost32.com/...tarenlaces.php veran que en la lista, el siguiente elemento sale unos X píxeles más a la derecha que el anterior, ...
  #1 (permalink)  
Antiguo 05/06/2009, 13:55
 
Fecha de Ingreso: febrero-2009
Mensajes: 580
Antigüedad: 8 años, 10 meses
Puntos: 13
Alguien sabe por qué se me desplazan los <li> estos?

hola!

si quieren mirar aqui http://keepyourlinks.byethost32.com/...tarenlaces.php veran que en la lista, el siguiente elemento sale unos X píxeles más a la derecha que el anterior, hasta que desborda y vuelve a empezar.

he probado quitar las imágenes, y se muestra correctamente; es decir, todos alineado a la izquierda. Pero en la propiedad de img o li no hay padding alguno, lo pueden ver en: http://keepyourlinks.byethost32.com/metal/style.css

Alguna idea?

gracias!
__________________
¿ya conoces la red social de cocina? descubre y comparte recetas de cocina
TONIWEB, un programador web freelance
  #2 (permalink)  
Antiguo 05/06/2009, 14:00
Avatar de Triby
Mod on free time
 
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 9.740
Antigüedad: 9 años, 3 meses
Puntos: 2112
Respuesta: Alguien sabe por qué se me desplazan los <li> estos?

Ya que estas declarando un doctype, seria conveniente apegarte a los estandares que seleccionaste. Intenta validar el codigo antes de proseguir.

Una linea con muchos errores:
Código html:
Ver original
  1. <h4>2 Results in all categories</h4><hr/> <br><ul style='list-style:none;'><div id="link0"><li><img src="http://www.forosdelweb.com/f53/images/linket.png" alt="link" width="20" height="20" /> <a href="javascript:llamarasincrono('php/link.php?id=91','link0','GET')";>Hattrick</a></div></li><div id="link1"><li><img src="http://www.forosdelweb.com/f53/images/linket.png" alt="link" width="20" height="20" /> <a href="javascript:llamarasincrono('php/link.php?id=93','link1','GET')";>Hard-H2o</a></div></li></ul>          <div id="newlink" style="padding-left:10%;""><img src="http://www.forosdelweb.com/f53/images/add.png" alt="add" width="10" height="10" style="text-decoration:none;" /> <a href="javascript:llamarasincrono('./php/formlink.php', 'newlink','GET');"> New link</a></div>
  2.                   </div>

Validador xHTML: http://validator.w3.org/
__________________
- León, Guanajuato
- GV-Foto
  #3 (permalink)  
Antiguo 05/06/2009, 14:14
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: Alguien sabe por qué se me desplazan los <li> estos?

Hola Ban
Tienes un error en cómo conformas las listas.
Todo lo contenido en una lista <ul> debe estar contenido en sus respectivos <li> y son estos los que pueden alojar imágenes, divs, p, etc.

Sin embargo tú tienes otros elementos distintos a los li como hijos directos de ul
Correcto:
Cita:
<ul>
<li>
<div>...... </div>
</li>
<li> más cosas</li>
</ul>
Mal:
Cita:
<ul>
<div> ...</div>
<li>... </li>
</ul>
Corrige eso y después ya veremos.
Un saludo

Aventuro una hipótesis: puede ser que se estén sumando (herencia) los padding || margin laterales.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++

Última edición por kseso?; 05/06/2009 a las 14:41
  #4 (permalink)  
Antiguo 05/06/2009, 16:06
 
Fecha de Ingreso: febrero-2009
Mensajes: 580
Antigüedad: 8 años, 10 meses
Puntos: 13
Respuesta: Alguien sabe por qué se me desplazan los <li> estos?

hola,

muchas gracias por vuestros posts!

he metido todo el elemento dentro del <li>

la linea es complicada, pues la genero con PHP...

para que veais lo que digo de las imagenes,

con (sale mal):
http://keepyourlinks.byethost32.com/...aces.php?all=1
sin (sale 'bien'):
http://keepyourlinks.byethost32.com/...tarenlaces.php


yo no lo entiendo... :S
__________________
¿ya conoces la red social de cocina? descubre y comparte recetas de cocina
TONIWEB, un programador web freelance
  #5 (permalink)  
Antiguo 05/06/2009, 16:43
Avatar de Triby
Mod on free time
 
Fecha de Ingreso: agosto-2008
Ubicación: $MX->Gto['León'];
Mensajes: 9.740
Antigüedad: 9 años, 3 meses
Puntos: 2112
Respuesta: Alguien sabe por qué se me desplazan los <li> estos?

La imagen es mas grande que la altura de linea (line-height) y por eso hace que todo se recorra. Reduce la imagen o aumenta el tamaño de linea para cada li.
__________________
- León, Guanajuato
- GV-Foto
  #6 (permalink)  
Antiguo 05/06/2009, 16:57
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Alguien sabe por qué se me desplazan los <li> estos?

Creo que deberías eliminar el float left de #rightcontent_section img. De todas maneras, es mucho mejor que pongas la imagen de fondo de los enlaces o de una clse que des a esos enlaces y les des un padding-left para mostrarla. Es infinitamente más económico en cófigo que incrustar la imagen cien veces.
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 05:31.