La lista se sale del DIV ¿Por que?

juanolo · #1 (**permalink**) 24/04/2009, 04:51

Tengo una lista dentro de un DIV.
En internet explorer se ve bien, pero en firefox, los puntos de cada elemento se sale de la lista.
¿Por que? ¿Como puedo hacer para que se vea bien en ambos navegadores?

Os pongo una imagen donde se ve lo que me pasa...
i78.photobucket.com/albums/j88/lovelessboy8/divlistafallo.jpg
(No pongo enlace directo porque no me deja de momento el foro)

INDEX.PHP

Código PHP:

 
<body> 
<div id="contenedor"> 
 <div id="cabecera"><?php include("cabecera.php") ?></div> 
 <div id="menu"><?php include("menu.php") ?></div> 
 <div id="contenido"><?php include("introduccion.php") ?></div> 
 <div id="pie"><?php include("pie.php") ?></div> 
</div>

MENU.PHP

Código PHP:

  <li>INTRODUCCION</li> 
<ul class="lista_menu"> 
    <li>Lenguajes de tipo cliente</li> 
    <li>Lenguajes de tipo servidor</li> 
    <li>Estandar W3C</li> 
    <li>Test acid2 y acid3</li> 
</ul> 
<hr /> 
<li>HTML</li> 
<ul class="lista_menu"> 
    <li>¿Que es y como se utiliza?</li> 
    <li>Guia rapida</li> 
    <li>Estructura basica</li> 
    <li>Texto</li> 
    <li>Enlaces</li> 
    <li>Imagenes</li> 
    <li>Tablas</li> 
    <li>Divisiones</li> 
    <li>Listas</li> 
    <li>Formularios</li> 
</ul> 
<hr />

ESTILO.CSS

Código css:

Ver original/*ID del DIV que contendra y centrara la pagina*/
#contenedor { width:950px;margin:auto;}
/*ID DIV menu*/
#menu
{
    background:#FFC;
    float:left;
    width:200px;
}
/*ID DIV Contenido*/
#contenido 
{
    background:#990000;  
    float:left;
    width:750px;
    height:100%;
}
/*CLASE estilo lista del menu*/
.lista_menu
{
    list-style-type: decimal;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
}

Bam_Margera · #2 (**permalink**) 24/04/2009, 06:41

Creo que deberías poner todos los <li> (list item) dentro de <ul> (lista sin orden), pues son lo que se te salen, prueba así

Cita:

<ul class="lista_menu">
<li>INTRODUCCION</li>
<ul class="lista_menu">
<li>Lenguajes de tipo cliente</li>
<li>Lenguajes de tipo servidor</li>
<li>Estandar W3C</li>
<li>Test acid2 y acid3</li>
</ul>
<hr />
<li>HTML</li>
<ul class="lista_menu">
<li>¿Que es y como se utiliza?</li>
<li>Guia rapida</li>
<li>Estructura basica</li>
<li>Texto</li>
<li>Enlaces</li>
<li>Imagenes</li>
<li>Tablas</li>
<li>Divisiones</li>
<li>Listas</li>
<li>Formularios</li>
</ul>
</ul>

a ver que tal

FRAN00 · #3 (**permalink**) 24/04/2009, 08:35

yo probaría a darle un tamaño al <ul> para que quepa dentro del div.
también te recomiendo que te instales el complemento firebug o el webdevoloper en el firefox para solucionar problemas de todo tipo

juanolo · #4 (**permalink**) 25/04/2009, 10:03

Gracias por la ayuda ^^ funciono la solucion de Bam y las utilidades que me recomiendas Fran00 estan muy bien.

Un saludo!