Float 2 divs in ein übergeordnetes div-Element und arrangieren Sie solche divs eine unter anderen

Ich bin erstellen einer web-Seite mit 3 Spalten. Die mittlere Spalte ist, wo alle Inhalte geht. Die Inhalte, die ich eingeben möchten, muss das format der Links ausgerichtet Bild, gefolgt von etwas text neben dem Bild. Und dieser fließt in der gesamten Spalte mit verschiedenen Bildern und entsprechenden text. Da mein layout ist ein div-basiertes layout, ich habe ein main-div (page_content )für die Spalte. Dann ist die überschrift (h4) und unterhalb der überschrift, die ich eingegeben habe ein anderes div. Dieses div enthält wiederum einzelne divs sind verschachtelt mit div (Klasse Foto) für Bild und div (class lat_art) für den text. Der HTML-code und CSS-code sind unten gegeben worden. Mein Problem ist, dass das erste Bild und text kommt, aber die nachfolgenden bekommen aufgereiht, die vertikal unter dem ersten text, den ich.e nimmt nur 50% der div-Element und schwimmt rechts, schiebt seine entsprechenden text darunter in der gleichen 50% Platz. Sollte ich geben Sie eine Höhe für die einzelnen divs, die wahrscheinlich das Bild größer als der text. Aber wenn ich das Tue, nicht mein code zu statisch werden. Ich möchte es dynamisch sein. Bitte helfen Sie.

HTML-Code

<div id="page_content"> 
<h4 class="center_cap">LATEST ARTISTS</h4> 
<!--Div for the content begins here--> 
<div> 
<!--Individual div begins here--> 
<div > 
<div class="photo"> 
<img src="Images/guitar.jpg" alt="guitar"/> 
</div> 
<div class="lat_art"> 
<span class="artist">ROCK ON</span> 
<p> 
Good news to all the fans of 'Rock On'. Concerts all around the world. 
</p> 
</div> 
</div> 
<!--Individual div ends here--> 

<!--Individual div begins here--> 
<div > 

<div class="photo"> 
<img src="Images/guitar.jpg" alt="guitar"/> 
</div> 

<div class="lat_art"> 
<span class="artist">ROCK ON</span> 
<p> 
Good news to all the fans of 'Rock On'. Concerts all around the world. 
</p> 
</div> 
</div> 
</div> 
<!--Div for the content ends here--> 
</div> 

Code aus externen Stylesheet

.photo{ 
width:48%; 
float:left; 
padding-left:2px; 
} 
.lat_art{ 
width:50%; 
float:right; 
}