A ver si alguien se da cuenta dónde está el error. Lo estoy revisando y no logro darme cuenta.
Dejo el código CSS y HTML que me está volviendo loco. Seguro es una pavada, pero ya tengo la cabeza 'quemada' y no me doy cuenta.
Código:
<div id="main"> <div id="productos"> <div class="caja"> <div class="foto"> <img src="imagen01.jpg" alt=""/> </div> </div> <div class="caja"> <div class="foto"> <img src="imagen02.jpg" alt=""/> </div> </div> <div class="caja"> <div class="foto"> <img src="imagen03.jpg" alt=""/> </div> </div> </div> </div>
Código:
#main{ width:960px; } #productos{ float:left; width: 850px; padding: 30px 55px 30px 55px; } .caja{ float:left; position: relative; width: 230px; padding: 10px 10px 10px 10px; background: #407086; margin: 0 50px 10px 0; .foto{ float:left; }
La cuastión es que necesito que las tres capas con id="caja" se vean alineadas horizontalmente, con los espacios que le asigné mediante CSS.
Pero por alguna razón la tercer caja se coloca debajo de la primera. Y no entiendo por qué.
Espero que puedan ayudarme. SALUDOS!