Re: Three Column Issue

amiskinyar
Level 1

Three Column Issue

Hello Community,

When I send out an email the three column image/text stacks on MSO 365 Outlook.

Screenshot 2024-08-01 at 1.07.23 PM.png

 

Looks fine on all other clients. 

Screenshot 2024-08-04 at 11.38.02 AM.png

 

 Here is the code for this module. 

 

<table id="three-products9a7d62c7-5e23-4cd7-9aa5-b54fbd6b60ea" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_three-products"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top"> 
<center> 
<table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="560"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:40px;font-size:40px;" height="40px">&nbsp;</td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="table1-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="173"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo1e5fa03fc-53a1-4fad-8fb9-ca221b8f9da4" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_CFSP_Seal_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureNamef85de804-e615-4b9b-9821-666b4edebef9"> 
<div>
 Cutting edge marketing suite to connect with clients 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="descriptionc706aed6-25e4-4844-8b77-978f10d67ebc"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> 
<table class="spacer" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="20"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;" height="40" width="100%"></td> 
</tr> 
</tbody> 
</table> 
<table class="table1-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="173"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo2d614f96f-0b62-4408-a968-f503336f6165" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Dialogue_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureName286f00134-771d-48be-b55e-14a39cbd8a7e"> 
<div>
 Dialogues to handle objections with confidence 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="description22166a951-d752-41ed-95aa-ebeca734bdeb"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> 
<table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="1"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;" height="40" width="100%"></td> 
</tr> 
</tbody> 
</table> 
<table class="table1-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="right" border="0" cellpadding="0" cellspacing="0" width="173"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo3e7995b75-79a5-4581-91cd-ff93ac034d04" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Presentation_2173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureName3fe2dccf6-ebca-490f-b6f1-30cdd7a28705"> 
<div>
 All-new Buyer and Seller presentations to stand out 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="description3b751897c-4859-4f57-99a6-3f68d2be2a34"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:15px;font-size:15px;" height="15px">&nbsp;</td> 
</tr> 
</tbody> 
</table> 
</center> </td> 
</tr> 
</tbody> 
</table>

 

 

6 REPLIES 6
Disha_Goyal6
Level 4

Re: Three Column Issue

Hi @amiskinyar, please use this code

<table id="three-products9a7d62c7-5e23-4cd7-9aa5-b54fbd6b60ea" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_three-products" mktoName="three Products">
<tbody>
<tr>
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">
<center>
<table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="560">
<tbody>
<tr><td style="font-size:1px; line-height:1px;" height="40">&nbsp;</td></tr>
<tr>
<td>
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<th width="173" class="block" style="font-weight:normal;">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> <div class="mktoImg" id="photo1e5fa03fc-53a1-4fad-8fb9-ca221b8f9da4" mktoName="Photo1" mktolockimgsize="true"> <a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_CFSP_Seal_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20">&nbsp;</td></tr>
<tr>
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"><div class="mktoText" id="featureNamef85de804-e615-4b9b-9821-666b4edebef9" mktoName="FeatureName1"> <div>Cutting edge marketing suite to connect with clients </div> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="5">&nbsp;</td></tr>
<tr>
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300;text-align: center;border-collapse: collapse;"> <div class="mktoText" id="descriptionc706aed6-25e4-4844-8b77-978f10d67ebc" mktoName="Description1"> <div></div> </div> </td>
</tr>
</tbody>
</table>
</th>
<th width="20" class="block" style="font-weight:normal;" height="20">
<th width="173" class="block" style="font-weight:normal;">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> <div style="display:inline-block" class="mktoImg" id="photo2d614f96f-0b62-4408-a968-f503336f6165" mktoName="Photo2" mktolockimgsize="true"> <a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Dialogue_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20">&nbsp;</td></tr>
<tr>
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> <div class="mktoText" id="featureName286f00134-771d-48be-b55e-14a39cbd8a7e" mktoName="FeatureName2"> <div>Dialogues to handle objections with confidence </div> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="5">&nbsp;</td></tr>
<tr>
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> <div class="mktoText" id="description22166a951-d752-41ed-95aa-ebeca734bdeb" mktoName="Description2"> <div></div> </div> </td>
</tr>
</tbody>
</table>
</th>
<th width="20" class="block" style="font-weight:normal;" height="20">
<th width="173" class="block" style="font-weight:normal;">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> <div style="display:inline-block" class="mktoImg" id="photo3e7995b75-79a5-4581-91cd-ff93ac034d04" mktoName="Photo3" mktolockimgsize="true"> <a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Presentation_2173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="20">&nbsp;</td></tr>
<tr>
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> <div class="mktoText" id="featureName3fe2dccf6-ebca-490f-b6f1-30cdd7a28705" mktoName="FeatureName3"> <div>All-new Buyer and Seller presentations to stand out </div> </div> </td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="5">&nbsp;</td></tr>
<tr>
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> <div class="mktoText" id="description3b751897c-4859-4f57-99a6-3f68d2be2a34" mktoName="Description3"> <div></div> </div> </td>
</tr>
</tbody>
</table>
</th>
</table>
</td>
</tr>
<tr><td style="font-size:1px; line-height:1px;" height="15">&nbsp;</td></tr>
</tbody>
</table>
</center>
</td>
</tr>
</tbody>
</table>


Also, please add this CSS in style tag
@media only screen and (max-width: 640px){

.block{width:100% !important;display:block;}

}

Thanks,

Disha

Chargotra
Level 2

Re: Three Column Issue

<table id="three-products9a7d62c7-5e23-4cd7-9aa5-b54fbd6b60ea" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_three-products"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse; background-color:#ffffff;" bgcolor="#ffffff" valign="top"> 
<center> 
<table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="560"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse; line-height:40px; font-size:40px;" height="40px">&nbsp;</td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<!-- Start of column container -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" style="padding: 0; margin: 0;">
<!-- Column 1 -->
<table class="column" width="173" style="display: inline-block; vertical-align: top; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" border="0" cellpadding="0" cellspacing="0">
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo1e5fa03fc-53a1-4fad-8fb9-ca221b8f9da4" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_CFSP_Seal_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureNamef85de804-e615-4b9b-9821-666b4edebef9"> 
<div>
 Cutting edge marketing suite to connect with clients 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="descriptionc706aed6-25e4-4844-8b77-978f10d67ebc"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> 
<!-- Spacer for columns -->
<table class="spacer" style="display: inline-block; vertical-align: top; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="20"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;" height="40" width="100%"></td> 
</tr> 
</tbody> 
</table> 
<!-- Column 2 -->
<table class="column" width="173" style="display: inline-block; vertical-align: top; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" border="0" cellpadding="0" cellspacing="0">
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo2d614f96f-0b62-4408-a968-f503336f6165" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Dialogue_173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureName286f00134-771d-48be-b55e-14a39cbd8a7e"> 
<div>
 Dialogues to handle objections with confidence 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="description22166a951-d752-41ed-95aa-ebeca734bdeb"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> 
<!-- Spacer for columns -->
<table style="display: inline-block; vertical-align: top; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="1"> 
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;" height="40" width="100%"></td> 
</tr> 
</tbody> 
</table> 
<!-- Column 3 -->
<table class="column" width="173" style="display: inline-block; vertical-align: top; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" border="0" cellpadding="0" cellspacing="0">
<tbody> 
<tr> 
<td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0"> 
<tbody> 
<tr> 
<td align="center" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse;"> 
<div style="display:inline-block" class="mktoImg" id="photo3e7995b75-79a5-4581-91cd-ff93ac034d04" mktolockimgsize="true"> 
<a><img alt="Photo" src="https://info.buffini.com/rs/375-EKE-881/images/2024_07_Presentation_2173x97.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" height="auto" width="173" /></a> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:20px;font-size:20px;" height="20px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font name" style="hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;-ms-text-size-adjust: 100%;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; font-weight: bold;text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="featureName3fe2dccf6-ebca-490f-b6f1-30cdd7a28705"> 
<div>
 All-new Buyer and Seller presentations to stand out 
</div> 
</div> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:5px;font-size:5px;" height="5px">&nbsp;</td> 
</tr> 
<tr> 
<td class="primary-font description" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;color: #000000; font-family: helvetica, arial, sans-serif; font-size: 15px; font-weight: 300; text-align: center;border-collapse: collapse;"> 
<div class="mktoText" id="description3b751897c-4859-4f57-99a6-3f68d2be2a34"> 
<div></div> 
</div> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
</tbody> 
</table> </td> 
</tr> 
<tr> 
<td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;border-collapse: collapse;line-height:15px;font-size:15px;" height="15px">&nbsp;</td> 
</tr> 
</tbody> 
</table> 
</center> </td> 
</tr> 
</tbody> 
</table>



Try this code if this will help, it worked for me

amiskinyar
Level 1

Re: Three Column Issue

Thank you for your response Chargotra,

I was able to find the fix elsewhere on this site, I simply added a "float" where there was an "align" and that fixed the problem. See below example. 

 

<table class="table1-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; float:left;" align="left" border="0" cellpadding="0" cellspacing="0" width="173">

amiskinyar
Level 1

Re: Three Column Issue

Thank you for your response Disha,

When I used that code it disabled all the modules in the email. However I was able to find the fix elsewhere on this site, I simply added a "float" where there was an "align" and that fixed the problem. See below example. 

 

<table class="table1-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; float:left;" align="left" border="0" cellpadding="0" cellspacing="0" width="173">

Disha_Goyal6
Level 4

Re: Three Column Issue

Hi @amiskinyar, float will not work in some of the email clients. Please check.

Jo_Pitts1
Level 10 - Community Advisor

Re: Three Column Issue

@amiskinyar ,

The solutions here feel incomplete.

You are better off using a MSO conditional to only output the table for Outlook desktop app for Windows.

That way, you can use the DIVs to be responsive on mobile clients.

There are many examples out there that demonstrate this principle in action.

 

Also, don't fix this in your email.  Fix it in your template so that you can use the fix in all emails in the future.

Cheers

Jo