Ver Mensaje Individual
  #4 (permalink)  
Antiguo 12/05/2011, 00:26
Jor1980
 
Fecha de Ingreso: mayo-2011
Mensajes: 72
Antigüedad: 12 años, 11 meses
Puntos: 1
Respuesta: Lograr que la anchura de mi ul se adapte al texto

Os adjunto el código html y el css.

La ul principal de mi código se llama navigationmenu, la ul que me da problemas es la contenida desntro de navigationmenu, porque cuando se despliegan los li lo hacen en forma de columna como yo quiero, pero alguno li cuyo tag a tiene demasiados caracteres digamos se muestran en dos líneas de la columna y yo quiero que aparezcan en una sola línea

Código PHP:
<ul id="navigationmenu">
          <
li><a href="#">Seguros de Coche</a>
                  <
ul>
                    <
li><a href="#">Póliza Básica</a></li>
                    <
li><a href="#">Póliza 7</a></li>
                    <
li><a href="#">Nueva Póliza 10</a></li>
                    <
li><a href="#">Póliza Líder</a></li>
                    <
li><a href="#">Póliza Todo Riesgo 100</a></li>
                </
ul><!--end Seguros de Coche list--->
      </
li><!--end Seguros de Coche-->
      
      
       <
li><a href="#">Seguros de Moto</a>
               <
ul>
                <
li><a href="#">Moto Básica</a></li>
                <
li><a href="#">Moto Diez</a></li>
                <
li><a href="#">Moto Líder</a></li>
            </
ul><!--end Seguros de Moto ul-->
       </
li>
                 
               
               
          <
li><a href="#">Seguros Generales</a>
                  <
ul>
                    <
li><a href="#">Hogar Básico</a></li>
                    <
li><a href="#">Hogar Familiar</a></li>
                    <
li><a href="#">Hogar Total</a></li>
                    <
li><a href="#">Hogar Platino</a></li>
                    <
li><a href="#">Seguro de Comercios</a></li>
                    <
li><a href="#">Seguro de Decesos</a></li>
                    <
li><a href="#">Seguro de Viajes</a></li>
                    <
li><a href="#">Responsabilidad Civil</a></li>
                    <
li><a href="#">Seguro de Comunidades</a></li>
                    <
li><a href="#">Seguro de Accidentes Personales</a></li>
                </
ul><!--end ul seguros generales-->
           </
li><!--end Seguros Generales li-->  
           
              
             <
li><a href="#">Seguros de Salud</a>
                  <
ul>
                    <
li><a href="#">Reembolso de Gastos</a></li>
                    <
li><a href="#">Asistencia Sanitaria</a></li>
                    <
li><a href="#">Seguros Indemnización por Baja</a></li>
                    <
li><a href="#">Salud Dental</a></li>
                </
ul><!--end ul Seguros de Salud-->    
          </
li><!--end li Seguros de Salud-->
          
          
             <
li>Seguros de Vida
                  
<ul>
                     <
li><a href="#">Planes de Pensiones</a></li>
                     <
li><a href="#">Seguro de Vida</a></li>
                     <
li><a href="#">Fondos de Inversión</a></li>
                     <
li><a href="#">PIAS</a></li>
                </
ul><!--end Seguros de Vida ul-->
          </
li><!--end Seguros de Vida li-->
             
          
          <
li>Productos Bancarios
              
<ul>
                <
li><a href="#">Hipotecas</a></li>
                <
li><a href="#">Consumo</a></li>
                <
li><a href="#">Cuenta Corriente</a></li>
                <
li><a href="#">Depósitos</a></li>
                <
li><a href="#">Líneas ICO</a></li>
            </
ul><!--end Productos Bancarios ul-->    
          </
li><!--end Productos Bancario li-->
    </
ul><!--navigationmenu end--> 
Y el css:

Código PHP:
#navigationmenu{
    
margin:0px;
    
padding:0px;
    
height:30px;
    
background-color:#3F0;
    
border-bottom:#999 solid;
    
display:block;
}

#navigationmenu a{
    
text-decoration:none;
    
color:#000;
    
text-align:center;
}



#navigationmenu li{
    
position:relative;
    
height:inherit;
    
float:left;
    list-
style:none;
    
margin:0px;
    
padding:0px;
    
display:block;
    
width:150px;
    
text-align:center;
}

#navigationmenu li:hover{
    
background-color:#999;
}




#navigationmenu ul li a{
    
text-align:left;
    
height:30px
    
width:150px;
    
display:block;
    
color:#000;
}




#navigationmenu ul{
    
position:absolute;
    
visibility:hidden;
    
top:30px;
 }
 

 
 
#navigationmenu li:hover ul{
    
visibility:visible;
    
background-color:#999;