Problema con DIV

[mcastell]

Hola a tod@s! La verdad que siempre he resuelto mis dudas buscando entre las consultas de los demás por el foro, pero esta vez.. No consigo solucionarlo.

Tengo un contenedor (.all-content) que alberga dos DIVS (.content-pri y #right) que a la vez esta (#.content-pri) contiene dos más. La idea es dejar .content-pri a la izquierda y #right a la derecha con float

Código HTML:

 <div class="all-content">

				<div class="content-pri">

					<div id="principal">
						<div class="header-content">
						</div>
						<div id="content">
	
						</div>
					</div>
								
					<div class="content-table">		
						<div id="notes">
							<div class="header-table">
                                                        
							</div>
						</div>

						<div id="last-articles">
							<div class="header-table">
                                                            
							</div>			
						</div>
					</div>		
				
				</div>
			
				<div id="right">		
							
				</div>
	
			</div> 

CSS:

Código HTML:

#principal {
    background-color: #C4B498;
    margin: 0px 40px 20px 0px;
    width: 607px;
    height: 100px;
}

#right {
    width: 233px;
    height: 100px;
    border: solid 1px #fff;
    float: right;
}

.content-pri {
    width: 607px;
    border: solid 1px #fff;
    vertical-align: top;
}

.content-table {
    margin: 0;
    width: 606px;
    height: 100px;
}

.all-content {
    border: solid 1px #fff;
    margin: 20px 40px 20px 40px;
    width: 860px;
    position: relative;
}

Tal y como he pegado el código, me situa la capa #right a la derecha pero.. En la parte inferior fuera del contenedor. Si añado la propiedad float: left; a la capa .content-pri, parece que no respete el espacio ni tamaño de la capa contenedor.

¿Alguna idea? Supongo que me habré hecho un lío tanto capa dentro de capa y debe ser una tontería.

Gracias de antemano.