Problema con un galeria de fotos

[josejump06]

Hola estoy haciendo una pagina web y quiero hacer como una galeria de fotos, pero lo que pasa esque hago varios divs englobados en uno y este a su vez en un article y este en una section. ¿que pasa? que cuando meto la img en las dos primeras divs se superponen no se va cada una al div que le pertenece y no se porque. Es como si las fotos fueran por su cuenta y no calleran del div.

Código HTML:

<section>

    <article>
        <div id="prd">
            <div id="p">
                <img alt="tiritas" src="imagenes/tiritas.jpg"></img>
            </div>
            <div id="p">
                <img alt="tiritas" src="imagenes/tiritas.jpg"></img>
            </div>
        </div>
    </article>

</section>
<style>
#prd
{
  margin-top: 3%;
  margin-bottom: 3%;
  margin-left: 20%;
  background: white;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border: 0px none #000000;
  width: 75%;
  height:1500px;
  
}
#prd div
{
  float: left;
  width: 20%;
  height: 250px;
  margin-left: 10%;
  margin-top: 2%;
  border-radius: 20px 20px 20px 20px;
  -moz-border-radius: 20px 20px 20px 20px;
  -webkit-border-radius: 20px 20px 20px 20px;
  border: 2px solid #000000;
}

#prd div img
{
width: 12%;
margin-top: 1%;
}

</style> 

¿Debería ponerle un id diferente a cada div para que las fotos fueran a su sitio o como lo hago?