Ver Mensaje Individual
  #1 (permalink)  
Antiguo 08/08/2013, 13:24
Avatar de catpaw
catpaw
 
Fecha de Ingreso: mayo-2010
Ubicación: xalapa
Mensajes: 856
Antigüedad: 14 años, 7 meses
Puntos: 23
DIV con elementos UL LI en IE8 se corta

Hola tengo un menu con las etiquetas <ul><li></li></ul>
Dentro de cada li, despliego un div (con ayuda de jquery) que contiene las opciones de cada item del menu. Este es el codigo del div que se despliega

Código CSS:
Ver original
  1. #m-contenedor{
  2. position:fixed;
  3. display:none;
  4. z-index:5;
  5. margin:5px 0 0 0;
  6. padding:5px;
  7. max-width:530px;
  8. background-color:#fff;
  9. border-left:1px solid #f9f9f9;
  10. border-right:1px solid #f9f9f9;
  11. border-bottom:3px solid #2e8b57;
  12. }
  13. #m-contenedor ul{
  14. list-style:none;
  15. list-style-image:none;
  16. padding:0;
  17. }
  18. #m-contenedor li{
  19. list-style:none;
  20. list-style-image:none;
  21. margin-bottom:5px;
  22. padding:0;
  23. }
  24. #m-contenedor .m-cont-columna{
  25. display:block;
  26. float:left;
  27. max-width:215px;
  28. margin-left:4px;
  29. padding:5px;
  30. }

y este es un ejemplo del html:

Código HTML:
<li>Opcion 1
	<div id="m-contenedor">
        	<ul class="m-cont-columna">
                	<li><a href="folder/script1.php">Opcion 1.1</a></li>
			<li><a href="folder/script2.php">Opcion 1.2</a></li>
			<li><a href="folder/script3.php">Opcion 1.3</a></li>
		</ul>
		<ul class="m-cont-columna">
                	<li><a href="folder/script4.php">Opcion 1.4</a></li>
			<li><a href="folder/script5.php">Opcion 1.5</a></li>
			<li><a href="folder/script6.php">Opcion 1.6</a></li>
		</ul>
		<ul class="m-cont-columna">
                	<li><a href="folder/script7.php">Opcion 1.7</a></li>
			<li><a href="folder/script8.php">Opcion 1.8</a></li>
			<li><a href="folder/script9.php">Opcion 1.9</a></li>
		</ul>
                <div class="clear"></div>
	</div>
</li> 
El caso es que en ie9, firefox, chrome cuando el div class m-contenedor se alarga tanto que "sale" de la pantalla el ultimo ul class m-cont-columna da un "enter" y se muestra abajo del primer ul class m-cont-columna, lo cual es correcto,

pero en ie8 las ul class m-cont-columna quedan en linea y la ultima no se aprecia porque se la "come" la pantalla

http://subir.cc/images/sinttugug.png



pff espero haberme explicado, bueno como podria hacer para que en ie8 obligue a dar "enter" a la ultima (sean 3 o mas ul class m-cont-columna) para que se aprecien todas las opciones del div class m-contenedor

gracias