Hey there,

I am creating a responsive email template and I have two tables next to each other with the left and right alignment declared. When I view in other email platforms everything looks great, however when I view in Outlook 2007/2010 the tables are being cut off; http://screencast.com/t/GW44PdRX.

Here is my code:

<!-- two column article begin --><table width="700" border="0" cellspacing="0" cellpadding="0" style="margin-top:0; margin-bottom:0; margin-right:0; margin-left:0; padding-top:0; padding-bottom:0; padding-right:0; padding-left:0; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important;" class="responsive-table">
  <tr>
    <td style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"><table width="100%" border="0" cellspacing="0" cellpadding="0" style="margin-top:0; margin-bottom:0; margin-right:0; margin-left:0; padding-top:0; padding-bottom:0; padding-right:0; padding-left:0; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important;">
  <tr>
    <td background="[cc(newsletter_2014_themes):article_background]" style="background-repeat:no-repeat;" bgcolor="#ffffff" width="700" valign="top">
  <!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" repeat="false" stroke="false" style="width:700px; height:518px;">
    <v:fill type="tile" src="[cc(newsletter_2014_themes):article_background]" color="#ffffff" />
     <v:textbox inset="0,0,0,0">
  <![endif]-->
  <div><table width="700" border="0" cellspacing="0" cellpadding="0" style="margin-top:0; margin-bottom:0; margin-right:0; margin-left:0; padding-top:0; padding-bottom:0; padding-right:0; padding-left:0; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important;" class="responsive-table">
  <tr>
    <td width="25" height="45" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="650" height="45" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="padding"></td>
    <td width="25" height="45" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="25" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="650" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:55px; color:[cc(newsletter_2014_themes):text_color]; line-height:55px; text-align:center;" align="center" class="hashtag">TITLE GOES HERE</td>
    <td width="25" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="25" height="22" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="650" height="22" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"></td>
    <td width="25" height="22" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="25" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="650" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" valign="top"><!-- tables begin --><table width="650" cellpadding="0" cellspacing="0" border="0" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="block-table">
    <tr>
    <td valign="top" align="center"><!-- left table begin --><table width="323" border="0" cellspacing="0" cellpadding="0" align="left" class="2col-table" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;">
  <tr>
    <td width="313" colspan="3" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"><img src="http://visitutah.dmplocal.com/dsc/collateral/Newsletter_2Col_Pic.jpg" width="313" height="239" border="0" title="Picture" alt="Picture" style="display:block;" class="mobile-size" /></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="313" colspan="3" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"><img src="http://visitutah.dmplocal.com/dsc/collateral/Newsletter_2Col_Shadow.jpg" width="313" height="30" border="0" title="Shadow" alt="Shadow" style="display:block;" class="mobile-size" /></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:30px; color:[cc(newsletter_2014_themes):text_color]; line-height:45px; text-align:left;" class="3col-title">TITLE GOES HERE</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:14px; color:#999999; line-height:36px; text-align:left;" class="subtitle">Subtitle goes here</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"></td>
    <td width="33" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:18px; text-align:left; color:#333333;" class="article-text2">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"></td>
    <td width="33" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
  <tr>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:23px; color:[cc(newsletter_2014_themes):text_color]; line-height:23px; text-align:left;" class="subtitle">“Quis nostrud exercitation ullamaco labo- ris. Nisi ut aliquip ex ea commodo dolor in nulla.”</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="10"></td>
  </tr>
</table><!-- left table end --><!--[if gte mso 9]>
</td>
<td valign="top">
<![endif]--><!-- right table begin --><table width="323" border="0" cellspacing="0" cellpadding="0" align="right" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="2col-table-right">
  <tr>
    <td width="10"></td>
    <td width="313" colspan="3" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"><img src="http://visitutah.dmplocal.com/dsc/collateral/Newsletter_2Col_Pic.jpg" width="313" height="239" border="0" title="Picture" alt="Picture" style="display:block;" class="mobile-size" /></td>
  </tr>
  <tr>
    <td width="10"></td>
    <td width="313" colspan="3" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"><img src="http://visitutah.dmplocal.com/dsc/collateral/Newsletter_2Col_Shadow.jpg" width="313" height="30" border="0" title="Shadow" alt="Shadow" style="display:block;" class="mobile-size" /></td>
  </tr>
  <tr>
    <td width="10"></td>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:30px; color:[cc(newsletter_2014_themes):text_color]; line-height:45px; text-align:left;" class="3col-title">TITLE GOES HERE</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="10"></td>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:'Open Sans Condensed', Helvetica, sans-serif; font-size:14px; color:#999999; line-height:36px; text-align:left;" class="subtitle">Subtitle goes here</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="10"></td>
    <td width="21" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;"></td>
    <td width="33" height="10" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
  <tr>
    <td width="10"></td>
    <td width="21" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="259" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:18px; text-align:left; color:#333333;" class="article-text2">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br /><br />
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</td>
    <td width="33" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
</table><!-- right table end --></td>
</tr>
</table><!-- tables end --></td>
    <td width="25" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
</tr>
<tr>
    <td width="25" height="55" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
    <td width="650" height="55" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="padding"></td>
    <td width="25" height="55" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt;" class="mobile-hide"></td>
  </tr>
</table></div>
  <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]--></td>
  </tr>
</table></td>
  </tr>
</table><!-- two column article end -->

Any idea why this would happen?

Thanks!
VW