Para no molestarte con lo que hiciste bien y lo que hiciste mal, vamos a lo concreto.
El problema se debe al posicionamiento con absolute. Para que puedan acomodarse los div donde quieres lo mejor es que elimines la posición y
acomodes los div con margenes y con el selector float.
Asi bateando un poco con tu codigo te deberia quedar algo asi:
Código CSS:
Ver original#apDiv1 {
width: 181px;
height: 475px;
margin: 20px 5px 20px 10px; /* donde el primer valor es el margen de arriba, luego a la derecha, abajo y a la izquierda */
float: left; /* le permite a los otros div colocarse al lado iz del anterior */
z-index:1;
}
#apDiv2 {
width:172px;
height:333px;
margin: 20px 5px 20px 10px;
float: left;
z-index:2;
}
#apDiv3 {
width:169px;
height:370px;
margin: 20px 5px 20px 10px;
float: left;
z-index:3;
}
el último div deberia flotarse solo. Pero quitale la posicion u los margenes que le pusiste.
Las medidas estan hechas a simple vista, ya te tocará poner los valores que necesites.
Espero te sirva de guia.
Saludos,