Entrar

problema con una lista

arijape · · Solicitar retirada
Hola, buenas, tengo un problema con las palabras de la lista del menú lateral. En vez de salir una debajo de otra como pretendo, algunas salen en la misma línea que otras. ¿Es porque se han puesto entre
  • palabra seguidos? Cómo se pone para que salgan una debajo de la otra, en líneas diferentes?
    Gracias. :wink:
    • Remtick · · Solicitar retirada
    Fijaste si en tu hoja de estilos esta asi:

    #menu li(o como le allas puesto) {float:left (o right o donde sea xD)
    fijate lo mismo en el contenido li ; ya que pudiste averlo puesto en este para que sus listas esten para la izquierda...

    Tambien puede ser por q te olvidaste de cerrar o abrir algun
  • arijape · · Solicitar retirada
    Lo he intentado y no funciona. Pongo aquí mi html a ver qué está mal:

    plantilla
    <div id="menu">
    <ul>
  • LITERATURA
  • INFANTIL Y COMIC
  • HUMANIDADES
  • ARTES
  • ECONOMÍA Y DERECHO
  • CIENCIAS
  • INFORMÁTICA
  • FILOLOGÍA Y FORMACIÓN
  • PARA COMPRAR
    </div>
    css
    #menu {background-image: url(objetos/menu fondo.gif);width: 150px ; height:336px ; float:left ;margin:0px 10px 3px 0px}
    #menu li {list-style:none; margin: 12px 0px 12px 6px;font-size:0.7em}
    • arijape · · Solicitar retirada
    Claro:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Libros de la Red</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="cabecera"><a href="index.html">[contenido no disponible]</div>
    <div id="navegacion">
    <div id="navegacion">
    <ul>
  • Artículos Literatura
  • Artículos Humanidades
  • Artículos Artes
  • Artículos Economía/Derecho
  • Artículos Ciencias
  • Artículos Informática
    </div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • LITERATURA
  • INFANTIL Y COMIC
  • HUMANIDADES
  • ARTES
  • ECONOMÍA Y DERECHO
  • CIENCIAS
  • INFORMÁTICA
  • FILOLOGÍA Y FORMACIÓN
  • PARA COMPRAR
    </div>


    <h4>El mundo de los libros</h4><h3>Literatura: artículo del mes</h3>Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.

    Y este es el tercer párrafo. En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.

    Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.Esta será la zona principal de la web</p></div>
    <div id="pie">Este es el pié de página</div>
    </div>


    </body>
    </html>

    css
    * {margin:0px ; padding:0px ; border: 0px}
    body {text-align: center}
    #global {width:800px ; margin: 0px }
    #cabecera {background-color: white }
    #navegacion {background-color: gray ;margin:0px 0px 0px 0px; height:20px}
    #navegacion li {float:left; list-style:none; ;font-size:0.8em ;margin: 0px 10px 0px 10px ; margin-top:2px}
    #contenido {background-color: orange ; text-align:left; border-left: black 1px solid ; border-right: black 1px solid}
    a {color: white; text-decoration: none; display: block}
    a:link {}
    a:visited {}
    a:hover {color: green; text-decoration: none; background-color: white}
    a:active {}
    #menu {background-image: url(objetos/menu fondo.gif);width: 150px ; height:336px ; float:left ;margin:0px 10px 3px 0px}
    #menu li {list-style:none; margin: 12px 0px 12px 6px;font-size:0.7em}
    p {text-align: justify}
    #contenido p {padding: 5px 10px 5px 10px; text-indent: 15px}
    h3 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
    h4 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
    #pie {background-color: brown}
    • Yaneth · · Solicitar retirada
    el fallo lo veo en css

    son pekeñas cosas,

    en la linea del *
    te falta text-indent: 0px

    aqui en rojo lo que te falta

    #global {width:800px ; margin: 0px auto}

    en el html

    creaste dos veces navegacion

    <div id="navegacion">
    <div id="navegacion">
    <ul>

    yyy, debes ponerle mas texto a contenido
    ya que debe ser mayor que el menu
    hablando de altura

    lo checas y nos avisas

    saludos
    arijape · · Solicitar retirada
    Gracias. Era por la doble línea de la capa navegación.
    Ahora tengo el problema de que no se ve la imagen de fondo que le he puesto a la capa menu (menu fondo.gif) en el firefox, en el i explorer sí se ve. QUé puede ser?
    arijape · · Solicitar retirada
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Libros de la Red</title>
    <meta content="text/html; charset=iso-8859-1" http-equiv=Content-Type>
    <link rel="stylesheet" href="estilo-general.css" type="text/css" media="all">
    </head>
    <body>
    <div id="global">
    <div id="cabecera"><a href="index.html">[contenido no disponible]</div>
    <div id="navegacion">
    <ul>
  • Artículos Literatura
  • Artículos Humanidades
  • Artículos Artes
  • Artículos Economía/Derecho
  • Artículos Ciencias
  • Artículos Informática
    </div>
    <div id="contenido">
    <div id="menu">
    <ul>
  • LITERATURA
  • INFANTIL Y COMIC
  • HUMANIDADES
  • ARTES
  • ECONOMÍA Y DERECHO
  • CIENCIAS
  • INFORMÁTICA
  • FILOLOGÍA Y FORMACIÓN
  • PARA COMPRAR
    </div>


    <h4>El mundo de los libros</h4><h3>Literatura: artículo del mes</h3>Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.

    Y este es el tercer párrafo. En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.

    Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.Esta será la zona principal de la web

    Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.

    Y este es el tercer párrafo. En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.

    Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.Esta será la zona principal de la web

    Este es mi segundo párrafo. Acabo de poner un punto y en cambio sigue siendo un párrafo pues no le he colocado aún la etiqueta de cierre. Voy a ponersela justo aquí.

    Y este es el tercer párrafo. En pocas lecciones aprenderé a darle margenes para separarlos unos de otros, e incluso hacerles sanguias por la izquierda a la primera línea, que queda mucho mejor.

    Anda, fijate! Salen todos centrados, que cosa. Espero que Jorgens nos enseñe a ponerlos alineados a la izquierda, o justificados. Así esto parece una poesia! je je je.</p></div>
    <div id="pie">
    <div id="pieuno">Contacto:[correo eliminado]</div>
    <div id="piedos">TopSite</div>
    <div id="pietres">pie tres</div>
    </div>
    </div>


    </body>
    </html>

    * {text-indent:0px ;margin:0px ; padding:0px ; border: 0px;list-style: none}
    body {text-align: center}
    #global {width:800px ; margin: 0px }
    #cabecera {background-color: white }
    #navegacion {background-color: green ;margin:0px 0px 0px 0px; height:20px}
    #navegacion li {float:left ;font-size:0.8em ;margin: 0px 10px 0px 10px ; margin-top:2px}
    #contenido {background-color: white ; text-align:left}
    a {color: white; text-decoration: none; display: block}
    a:link {}
    a:visited {}
    a:hover {color: green; text-decoration: none; background-color: white}
    a:active {}
    #menu {background-color: yellow ;width: 150px ; height:280px ; float:left ;margin:0px 10px 3px 0px;background-image: url(objetos/menu fondo.gif)}
    #menu li {margin: 10px 0px 10px 6px;font-size:0.7em}
    p {text-align: justify}
    #contenido p {padding: 5px 10px 5px 10px; text-indent: 15px}
    h3 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
    h4 {font.size: 1.1em; color:blue ; font-weight: bold ; text-decoration: none ; text-align: left}
    #pie {background-color: white; height:90px;border-bottom: black 1px solid }
    #pieuno { float:left ; width:150px;font-size:0.7em; margin-top:60px }
    #piedos { float:left ; width:498px ; margin-top:60px}
    #pietres { float:left ; width:150px ; margin-top:60px}
    #pie a {color: blue; text-decoration:none ; display: block }
    #pie a:link {}
    #pie a:visited {}
    #pie a:hover {color:black ; text-decoration:underline ; background-color: white }
    #pie a:active {color:black}
    • arijape · · Solicitar retirada
    no puse lo de auto porque quiero que la página salga pegada a la izquierda del navegador.