divs beside each other

[sirlink99]

I am having trouble positioning divs beside each other

2 images one above the other with another image beside the 2 that are on top

here is what that part looks like

Html

<div class="leftDiv">
							<img src="Images/contact_front.png" width="150px" height="150px"><br />
							<img src="Images/contact_stairs.png" width="200px" height="150px">				
					</div>
					<iframe width="370" height="300" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.hu/maps?f=q&amp;source=s_q&amp;hl=hu&amp;geocode=+&amp;q=1072+Budapest+VII.+Ker%C3%BClet+Nagy+Di%C3%B3fa+u.+19&amp;ie=UTF8&amp;hq=&amp;hnear=Budapest,+Erzs%C3%A9betv%C3%A1ros,+Nagy+Di%C3%B3fa+utca+19&amp;ll=47.497893,19.064757&amp;spn=0.008191,0.01929&amp;t=m&amp;z=14&amp;vpsrc=6&amp;output=embed"></iframe><br /><small><a href="http://maps.google.hu/maps?f=q&amp;source=embed&amp;hl=hu&amp;geocode=+&amp;q=1072+Budapest+VII.+Ker%C3%BClet+Nagy+Di%C3%B3fa+u.+19&amp;ie=UTF8&amp;hq=&amp;hnear=Budapest,+Erzs%C3%A9betv%C3%A1ros,+Nagy+Di%C3%B3fa+utca+19&amp;ll=47.497893,19.064757&amp;spn=0.008191,0.01929&amp;t=m&amp;z=14&amp;vpsrc=6" style="color:#0000FF;text-align:left">Nagyobb térképre váltás</a></small>

css

.leftDiv{
	 position: relative;
     margin-right: 80px;
     display: inline;
}

It kind of works, except it puts the large image beside the bottom one. how can I fix this?

Thanks for any help

[simplypixie]

.leftDiv{
	 float: left;
     margin-right: 80px;
}

[drjohn]

and set a width on that div too.

[sirlink99]

Thanks.