Having problems creating a table for a WP site; any suggestions?

Hello all. I am trying to create a table for one of my Adsense sites, but for whatever reason it is not working out. It is just a simple 2 row, 5 column table where I want to have 3 images on the top row with a white 125 x 125 spacer in between them, and then have 2 Adsense ads and 1 Chitika ad on the bottom row with the same white spacer between the ads. For example:

Row 1 IMAGE spacer IMAGE spacer IMAGE
Row 2 AD spacer AD spacer AD


Unfortunately, when I ad the spacer to row 2, it drops the whole row down so it is no longer directly under the images. Here is the current code:


<div align="center">
<table>
<tr>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/whatmakeshair1_125x125.jpg" />
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/White-Square_125x125.png" />
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/whatmakeshair2_125x125.jpg" alt="" title="whatmakeshair2_125x125" width="125" height="125" class="alignnone size-full wp-image-23" />
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/White-Square_125x125.png" />
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/whatmakeshair3_125x125.jpg" alt="" title="whatmakeshair3_125x125" width="125" height="125" class="alignnone size-full wp-image-24" />
</td>
</tr>
</table>
</div>

<div align="center">
<table>
<tr>
<td>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-4233488587147750";
/* What makes hair - 125x125 */
google_ad_slot = "2917969506";
google_ad_width = 125;
google_ad_height = 125;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/White-Square_125x125.png" />
</td>
<td>
<script type="text/javascript">
ch_client = "bryhal";
ch_width = 160;
ch_height = 160;
ch_type = "mpu";
ch_sid = "Chitika Default";
ch_backfill = 1;
ch_color_site_link = "#0000CC";
ch_color_title = "#0000CC";
ch_color_border = "#FFFFFF";
ch_color_text = "#000000";
ch_color_bg = "#FFFFFF";
</script>
<script src="http://scripts.chitika.net/eminimalls/amm.js" type="text/javascript">
</script>
</td>
<td>
<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/White-Square_125x125.png" />
</td>
<td>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-4233488587147750";
/* What makes hair - 125x125 */
google_ad_slot = "2917969506";
google_ad_width = 125;
google_ad_height = 125;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</td>
</tr>
</table>
</div>


Does anyone see what is causing the problem? Basically I want the ads to be directly under the images, but for some reason, they get pushed down when I add the spacer to the second row. Any help would be greatly appreciated...

 

you miss to close the </tr> and add <tr> again, after the following lines :

<img src="http://whatmakeshairgrowfaster.org/wp-content/uploads/2011/08/whatmakeshair2_125x125.jpg" alt="" title="whatmakeshair2_125x125" width="125" height="125" class="alignnone size-full wp-image-23" />
</td>

 

If I do that, it starts a new row after the second image. I only want 2 rows - the first one with the images and the second one with the ads. Any other suggestions?

 

Can I ask why you are closing the first table with the images in and then creating a new one?

 

No real reason. I just copied the code from a HTML tutorial website and plugged in the necessary info. I changed it to being one table, and it still has the same problem.

 

I can see your Chitika ad is not the same size. Your google ads and images are all in 125x125 but your Chitika ad is 160x160.

By default, the content of a table cell is center vertically. Since you have an that need bigger space, that's the reason the ads not display directly under the images.

Try add style="vertical-align: top;" on the td of your second row, like this:

<td style="vertical-align: top;">

That should do it.

- Rufas

 

Is that what you want it to be like?
as that is how it looks for me but I haven't tried putting it in a WP site yet

 

This is what it looks like when I put it on my WP site.
It's only showing two due to the width of my content

 

After trying Rufas' suggestion, the ads moved up like I wanted. Thank you Rufus and to anyone else that made recommendations. Now I have to try to figure out why the sidebar disappeared

 

Can i see existing page where is that table?