alinear varios divs

[analoyra]

Hola, este es mi primera aplicacion que hago con photoshop e intentando codificar con html y css
Tengo un problema, que primero pongo los codigos y luego explico

Este es el html

Código HTML:

<div class="descripcion">
    <div class="campana">
        <div class="fecha">
         <p class="mes">Junio</p>
         <p class="dia">30</p>
        </div>
</div>  <!-- fin campaña -->
 
<ul id="menu">
        <li> <a href="#">Capacitación</a> </li>
        <li> <a href="#">Galería de imágenes</a> </li>
        <li> <a href="#">Ser Consulora</a> </li>
        <li> <a href="#">Promociones</a> </li>
        <li> <a href="#">Productos Natura</a> </li>
        <li> <a href="#">Consejos</a> </li>
        <li> <a href="#">Revista digital</a> </li>
        <li> <a href="#">Contacto</a> </li>
    </ul>
     
</div> <!-- fin descripcion -->
 

y este el css

Código CSS:

.descripcion {
   margin:0 auto;
   padding:0;
   height:188px;
   width:737px;
     }
 
 
ul#menu {
    margin:0;
    padding:0; 
    background:url(imagenes/menu.jpg) no-repeat ;
 
  }
  ul#menu li {
float:none;
height:20px;
padding-left:0px;
}  
 
.campana {
   margin:0;
   padding:0; 
   margin-left:15px;
   margin-top:16px;
   background:url(imagenes/calendario.png) no-repeat;
   width:112px;
   height:123px;
  
 }
 
 .descripcion .campana .fecha .mes {
   margin:0;
   padding:0;
   font-family:Tahoma, Verdana, arial, serfi;
   font-size:15px;
   color:white;
   margin-left:15px;
   margin-top:30px;
}
 
 .descripcion .campana .fecha .dia {
   margin:0;
   padding:0;
   font-family:Tahoma, Verdana, arial, serfi;
   font-size:50px;
   color:black;
   font-weight:bold;
   text-align:center;
}
 

tengo un conetenedor que se llama descripcion, y dentro de el quiero poner el div menu a la derecha del div campana, pero me es imposible. Logro ponerlo a la derecha pero no sacarle el margen superior, es decir me queda por debajo del div campana

Espero que me hayan entendio el problema y se agradeoce cualqueir ayuda de anetemano

[emiliodeg]

bueno ambos elementos el div y el ul son elementos en bloque nunca van a quedar por si solos uno al lado del otro

lo q deberias hacer es algo asi

.descripcion{overflow:hidden}
.campana,#menu{float:left;display:inline}
.campana{width:250px}
#menu{margin-left:10px;width:350px}

espero te sirva la ayuda, sirve para ie7+ y para el resto

[analoyra]

Hola, gracias por responder!
lo probe pero no anduvo, me lo sigue dejando debajo del calendario, otra idea?
Gracias

[MarioAraque]

Al ul menu te conviene meterlo dentro de un div, osea que te quede un div descripcion, que tenga dentro un div campana, y otro div "menu", con el ul dentro.

A campana y a menu hacelos flotar a la izquierda (float:left), y creo que te deberia funcionar, la suma de los widths de campana y menu, mas los de sus margins left y right, mas los de sus paddings left y right, deberia ser menor a 737px...

Saludos.

[analoyra]

Gracias! funciono asi, ya pude poner el menu a la derecha, ahora estoy luchando para que se me vaya al otro margen... pero es cuestion de matematica!