Widget Layout Question

Hey guys I don’t know why but I’'m having such a pain of a time trying to get this right.

I’ve got a Text sidebar widget where I want to place (4) 125x125 advertisements. stacked 2x2.

So

[AD1][AD2]
[AD3][AD4]

For whatever reason I can’t seem to get this lined up right. For example, look at:

I want the Peter Glenn ad to the right of the LIftopia ad. I’ve tried floating my DIV’s and some other stuff but just can’t seem to get it right. Also tried dumping the DIV’s into {p} which I know isn’t correct either…


	
	<p><!-- AZ_Sponsor_125x125_Position1 -->
		<div id='div-gpt-ad-1377194697742-2' style='width:125px; height:125px;'>
		<script type='text/javascript'>
		googletag.cmd.push(function() { googletag.display('div-gpt-ad-1377194697742-2'); });
		</script>
		</div>
	
	<!-- AZ_Sponsor_125x125_Position2 -->
		<div id='div-gpt-ad-1377194697742-3' style='width:125px; height:125px;'>
		<script type='text/javascript'>
		googletag.cmd.push(function() { googletag.display('div-gpt-ad-1377194697742-3'); });
		</script>
		</div>
		</p>

<br />
	<!-- AZ_Sponsor_125x125_Position3 -->
		<div id='div-gpt-ad-1377194697742-4' style='width:125px; height:125px;'>
		<script type='text/javascript'>
		googletag.cmd.push(function() { googletag.display('div-gpt-ad-1377194697742-4'); });
		</script>
		</div>

	<!-- AZ_Sponsor_125x125_Position4 -->
		<div id='div-gpt-ad-1377194697742-4' style='width:125px; height:125px;'>
		<script type='text/javascript'>
		googletag.cmd.push(function() { googletag.display('div-gpt-ad-1377194697742-4'); });
		</script>
		</div>	

Thanks for any help. I’m sure it’s something really ridiculous …

Add this css to each div

<div style="float:left;" 

If it still doesn’t work, you can use table for it

I think that worked. I didn’t do it on all elements earlier and it layed out wierd.

How do I center the whole block of four in the space available? Example on the home page alpinezone.com.

The center the div you can add this css


display: block;
margin: 0 auto;