SOLVED

Re: Microsoft Outlook update, 2 column no longer responsive

Go to solution
Khyra
Level 2

Microsoft Outlook update, 2 column no longer responsive

Microsoft Outlook underwent an update on the 19th. Now, the 2 column module in my emails is not responding as it should on the latest version of Microsoft Outlook for Mac desktop (blocs should be side by side, not one above each other). I'm wondering if anyone has also experienced this as of late? If so, what is the solve you found?2col_microsoftoutlook.png

1 ACCEPTED SOLUTION

Accepted Solutions
Khyra
Level 2

Re: Microsoft Outlook update, 2 column no longer responsive

I came across this thread and can report that the proposed solution worked for my template: 

https://litmus.com/community/discussions/8998-rendering-broken-on-outlook-for-mac-version-16-66

View solution in original post

7 REPLIES 7
SanfordWhiteman
Level 10 - Community Moderator

Re: Microsoft Outlook update, 2 column no longer responsive

To help with questions like this, we'll need examples of your HTML, not only a screenshot.

Re: Microsoft Outlook update, 2 column no longer responsive

Hi Sandy,

 

The problem is probably not the code because it's working everywhere except Outlook for Mac (business edition) when having the New Outlook option enabled (See screenshot). The free Mac version works well.

That problem occur a few months ago when Microsoft did an update, and they released a few days later an update that fixed it. It's the same code that was working since the last time the problem happened; we did no change since that moment.

unnamed.png
We were more interested to know if anybody has had trouble with their template since the last Outlook for business update. But if you still want a see the code, please communicate with me directly. 

Thank you! 

SanfordWhiteman
Level 10 - Community Moderator

Re: Microsoft Outlook update, 2 column no longer responsive

The point of sharing code is to enable people to reproduce your issue and assist with either code fixes or deeper explanations. There are infinite ways to create a 2 column form, some of which break in certain clients, some of which don't.

 

We prefer to keep communications here on the Nation for later readers to learn from.

cprovancher
Level 1

Re: Microsoft Outlook update, 2 column no longer responsive

My colleague and I are both on Microsoft Outlook for Mac (New Outlook), v16.69.1, on MacBook Pros running macOS Monterey. I can see 2-column emails as they should look, and my colleague sees them broken. Has anyone found a solution to this issue yet? It affects numerous templates for my organization, and if we need to rebuild them all, is there a resource that recommends the best approach to take?

Tags (2)
SanfordWhiteman
Level 10 - Community Moderator

Re: Microsoft Outlook update, 2 column no longer responsive

As noted above, we need your HTML in order to help you. "2 column" can be done infinite ways, so it's not possible to troubleshoot with only that information.

cprovancher
Level 1

Re: Microsoft Outlook update, 2 column no longer responsive

OK, here is the code for one of our newsletter templates. (Note it references Marketo variables that aren't included here, so it looks bad if you display it in a browser; but you should be able to see the coding around the multi-column section nonetheless.) Thanks for your help.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">

  <head> 

    <title>TechTarget</title> 

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

    <meta name="viewport" content="width=device-width, initial-scale=1.0 " /> 

    <meta name="format-detection" content="telephone=no" /> 

    <!-- Begin Marketo Variables --> 

    <meta class="mktoColor" id="colorPrimary" mktoname="Color: Primary" default="#00A69F" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorSecondary" mktoname="Color: Secondary" default="#00A69F" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorTertiary" mktoname="Color: Tertiary" default="#004661" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorBackground" mktoname="Color: Background" default="#F5F5F5" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorBackgroundAccent" mktoname="Color: Background Accent" default="#a0a0a0" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorTealCTA" mktoname="Color: TealCTA" default="#00A69F" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorBlueCTA" mktoname="Color: BlueCTA" default="#006884" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorRedCTA" mktoname="Color: RedCTA" default="#7b1716" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorHeadline" mktoname="Color: Headline" default="#004661" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorSubHeadline" mktoname="Color: SubHeadline" default="#004661" mktomodulescope="false" /> 

    <meta class="mktoColor" id="colorHeroBackground" mktoname="Color: HeroBackground" default="#F5F5F5" mktomodulescope="false" /> 

    <meta class="mktoNumber" id="height" mktoname="Padding Height" default="25" min="5" max="50" step="1" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="logo_height" mktoname="Logo Height" default="55" min="20" max="120" step="1" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="logo_height2" mktoname="Padding Height Logo" default="10" min="0" max="50" step="1" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="heightPaddingTop" mktoname="Padding Height (Top)" default="30" min="15" max="30" step="15" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="heightPaddingBottom" mktoname="Padding Height (Bottom)" default="30" min="15" max="30" step="15" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="hero_height" mktoname="Hero Height" default="250" min="20" max="500" step="1" mktomodulescope="true" /> 

    <meta class="mktoString" id="socialLinkGoogle" mktoname="Social Link: Google" default="https://plus.google.com/108734187604689859397" mktomodulescope="true" /> 

    <meta class="mktoString" id="socialLinkTwitter" mktoname="Social Link: Twitter" default="https://twitter.com/TechTarget" mktomodulescope="true" /> 

    <meta class="mktoString" id="socialLinkFacebook" mktoname="Social Link: Facebook" default="https://www.facebook.com/techtargetinc/" mktomodulescope="true" /> 

    <meta class="mktoString" id="socialLinkLinkedIn" mktoname="Social Link: LinkedIn" default="https://www.linkedin.com/company/techtarget" mktomodulescope="true" /> 

    <meta class="mktoString" id="ctaText" mktoname="CTA Text" default="Check It Out" mktomodulescope="true" /> 

    <meta class="mktoString" id="ctaLink" mktoname="CTA Link" default="#" mktomodulescope="true" /> 

    <meta class="mktoString" id="ctaText2" mktoname="CTA Text Right" default="Check It Out" mktomodulescope="true" /> 

    <meta class="mktoString" id="ctaLink2" mktoname="CTA LinkRight" default="#" mktomodulescope="true" /> 

    <meta class="mktoImg" id="bgImage650" mktoname="URL: Background Link (650width)" default="https://reg.techtarget.com/rs/095-PCN-759/images/800x400px-Placeholder.jpg" mktomodulescope="true" /> 

    <meta class="mktoNumber" id="hero_height_image_only" mktoname="Hero Height Image Only" default="150" min="10" max="500" step="1" mktomodulescope="true" /> 

    <!-- //End Marketo Variables --> 

    <style type="text/css">

body {

margin: 0 !important;

padding: 0 !important;

-webkit-text-size-adjust: 100% !important;

-ms-text-size-adjust: 100% !important;

-webkit-font-smoothing: antialiased !important;

}

img {

border: 0 !important;

outline: none !important;

}

p {

Margin: 0px !important;

Padding: 0px !important;

}

table {

border-collapse: collapse;

mso-table-lspace: 0px;

mso-table-rspace: 0px;

}

td, a, span {

border-collapse: collapse;

mso-line-height-rule: exactly;

}

.ExternalClass * {

line-height: 100%;

}

.ttgt_defaultlink a {

color: inherit !important;

text-decoration: none !important;

}

span.MsoHyperlink {

mso-style-priority: 99;

color: inherit;

}

span.MsoHyperlinkFollowed {

mso-style-priority: 99;

color: inherit;

}

.ttgt_Gray {

text-decoration: none;

color: #5A9876;

}

.ttgt_wht a {

color: #ffffff;

text-decoration: none;

}

.ttgt_dGray a {

color: #333333;

text-decoration: none;

}

footer.ttgt_ a {

color: #999999;

text-decoration: none;

}

 

/*Stylesheet for the devices width between 481px to 609px*/

@media only screen and (min-width:481px) and (max-width:609px) {

.ttgt_main_table {

width: 100% !important;

}

.ttgt_wrapper {

width: 100% !important;

}

.ttgt_hide {

display: none !important;

}

.ttgt_aside {

padding-left: 10px !important;

padding-right: 10px !important;

}

.ttgt_height {

height: 20px !important;

}

.ttgt_img {

width: 100% !important;

height: auto !important;

max-width: 100% !important;

}

.ttgt_spacer {

width: 10px !important;

}

.ttgt_pad {

padding: 20px 10px !important;

}

.header_logo {

padding: 2px 25px 0px !important;

}

.ttgt_pad2 {

padding: 0px 10px 20px !important;

}

.ttgt_center {

text-align: center !important;

}

.ttgt_font14 {

text-align: center !important;

}

.ttgt_font26_pad {

font-size: 25px !important;

line-height: 30px !important;

padding: 0px 10px 20px !important;

}

.ttgt_clear {

clear: both !important;

float: left !important;

width: 100% !important;

}

.ttgt_bottom {

padding-bottom: 20px !important;

}

.ttgt_top {

padding-top: 20px !important;

}

.ttgt_w170 {

width: 170px !important;

}

.ttgt_w260 {

width: 260px !important;

}

.ttgt_w30 {

width: 30px !important;

}

}

/*End of Stylesheet for the devices width between 481px to 599px*/

/*Stylesheet for the devices width below 480px */

@media screen and (max-width: 480px) {

.ttgt_main_table {

width: 100% !important;

}

.ttgt_wrapper {

width: 100% !important;

}

.ttgt_hide {

display: none !important;

}

.ttgt_img {

width: 100% !important;

height: auto !important;

max-width: 100% !important;

}

.ttgt_aside {

padding-left: 10px !important;

padding-right: 10px !important;

}

.ttgt_height {

height: 20px !important;

}

.ttgt_spacer {

width: 10px !important;

}

.ttgt_pad {

padding: 20px 10px !important;

}

.header_logo {

padding: 2px 10px 0px !important;

}

.ttgt_pad2 {

padding: 0px 10px 20px !important;

}

.ttgt_center {

text-align: center !important;

}

.ttgt_font14 {

text-align: center !important;

font-size: 12px !important;

}

.ttgt_font26 {

font-size: 25px !important;

line-height: 30px !important;

}

.ttgt_font26_pad {

font-size: 25px !important;

line-height: 30px !important;

padding: 0px 10px 20px !important;

}

.ttgt_clear {

clear: both !important;

float: left !important;

width: 85% !important;

}

u + .ttgt_body .ttgt_full_wrap {

width: 100% !important;

width: 100vw !important;

}

.ttgt_bottom {

padding-bottom: 20px !important;

}

.ttgt_w170 {

width: 170px !important;

}

.ttgt_top {

padding-top: 20px !important;

}

.ttgt_w260 {

width: 260px !important;

}

.ttgt_w30 {

width: 30px !important;

}

}

/*End of Stylesheet for the devices width below 374px */

</style> 

    <!--[if gte mso 9]>

<xml>

  <o:OfficeDocumentSettings>

    <o:AllowPNG/>

    <o:PixelsPerInch>96</o:PixelsPerInch>

 </o:OfficeDocumentSettings>

</xml>

<![endif]--> 

  </head> 

  <!-- blank gif row --> 

  <body class="ttgt_body" style="margin:0px; padding:0px;" bgcolor="${colorBackground}"> 

    <a href="https://www.bitpipe.com?hpsrc=true" style="text-decoration:none" reportname="https://www.bitpipe.com?hpsrc=true" frontuid="19381909">&nbsp;</a>  

    <!-- end blank gif row -->  

    <!--Full width table start--> 

    <table width="100%" border="0" cellspacing="0" cellpadding="0" class="ttgt_full_wrap" bgcolor="${colorBackground}"> 

      <tbody> 

        <tr> 

          <td align="center" valign="top" class="mktoContainer boxedbackground" id="template_wrapper">

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Navigation: Left Logo, No Links" id="navigation_left_logo_no_links"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:570px;" class="ttgt_wrapper" bgcolor="#f5f5f5"> 

                      <tbody> 

                        <tr> 

                          <td align="center" valign="top" style="padding:0px;" class="header_logo"> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0"> 

                              <tbody> 

                                <tr> 

                                  <td height="0px" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                </tr> 

                                <tr> 

                                  <td align="left" valign="top" class="ttgt_clear"> 

                                    <div class="mktoImg" mktoname="Logo" id="navigation_left_logo_no_links-" mktolockimgsize="true">

                                      <a href="https://www.techtarget.com/" target="_blank" style="text-decoration:none;"><img src="https://reg.techtarget.com/rs/095-PCN-759/images/TechTargetLogo_Teal-Email.png" height="${logo_height}" alt="TechTarget" border="0" style="font-family:Arial, sans-serif; font-size:15p; color:#00a69f; font-weight:bold;" /></a>

                                    </div> </td> 

                                </tr> 

                                <tr> 

                                  <td height="${logo_height2}" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                </tr> 

                              </tbody> 

                            </table> </td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Header: 2Col Image No CTA" id="header_2col_image_w_text_and_cta2a5fa165-4e08-4d90-a4a7-eaafcdec6a1a2ec6cb3d-d4e0-4636-9089-9e1841b9258c"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="${colorHeroBackground}"> 

                      <tbody> 

                        <tr> 

                          <td style="background-position:center center; background-repeat:no-repeat; background-size:cover;" height="${hero_height}" background="${bgImage650}" align="center" valign="top"> 

                            <!--[if gte mso 9]>

<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:650px;height:${hero_height};"mktolockimgsize="true">

<v:fill type="frame" src="${bgImage650}" color="${colorHeroBackground}" />

<v:textbox style="mso-fit-shape-to-text:false" inset="0,0,0,0">

<![endif]--> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0" style="width:650px;" class="ttgt_wrapper"> 

                              <tbody> 

                                <tr> 

                                  <td width="40" class="ttgt_spacer">&nbsp;</td> 

                                  <td align="center" valign="middle"> 

                                    <table width="100%" border="0" cellspacing="0" cellpadding="0" style="width:570px;" class="ttgt_wrapper"> 

                                      <tbody> 

                                        <tr> 

                                          <td height="30" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                        </tr> 

                                        <tr> 

                                          <td align="center" valign="top"> 

                                            <table width="100%" border="0" cellspacing="0" cellpadding="0"> 

                                              <tbody> 

                                                <tr> 

                                                  <td width="300" align="center" valign="top" class="ttgt_clear"> 

                                                    <table width="100%" border="0" cellspacing="0" cellpadding="0"> 

                                                      <tbody> 

                                                        <tr> 

                                                          <td align="left" valign="top" class="ttgt_wht ttgt_font26" style="font-family:Arial, sans-serif; font-size:25px; line-height:30px; color:${colorHeadline}; font-weight:bold;"> 

                                                            <div class="mktoText" mktoname="Text" id="header_2col_image_w_text_and_cta_text2a5fa165-4e08-4d90-a4a7-eaafcdec6a1a2ec6cb3d-d4e0-4636-9089-9e1841b9258c">

                                                              <p>Left aligned text box Neque porro quisquam adipisci dolorem ipsum quia dolor amet sit</p>

                                                            </div> </td> 

                                                        </tr> 

                                                        <tr> 

                                                          <td height="14" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                                        </tr> 

                                                      </tbody> 

                                                    </table> </td> 

                                                  <td width="120" class="ttgt_clear" height="10" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                                  <td width="150" align="center" valign="top" class="ttgt_clear"> 

                                                    <table width="150" border="0" cellspacing="0" cellpadding="0" align="right" class="ttgt_wrapper"> 

                                                      <tbody> 

                                                        <tr> 

                                                          <td height="10" style="line-height:1px; font-size:1px;" class="ttgt_hide">&nbsp;</td> 

                                                        </tr> 

                                                      </tbody> 

                                                    </table> </td> 

                                                </tr> 

                                              </tbody> 

                                            </table> </td> 

                                        </tr> 

                                        <tr> 

                                          <td height="32" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                                        </tr> 

                                      </tbody> 

                                    </table> </td> 

                                  <td width="40" class="ttgt_spacer">&nbsp;</td> 

                                </tr> 

                              </tbody> 

                            </table> 

                            <!--[if gte mso 9]>

</v:textbox>

</v:rect>

<![endif]--> </td> 

                        </tr> 

                        <tr> 

                          <td height="0" style="line-height:0px; font-size:0px;">&nbsp;</td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Divider: White-1" id="divider_white1"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="#FFFFFF"> 

                      <tbody> 

                        <tr> 

                          <td class="ttgt_height" height="${height}" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Body Text" id="body_text"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="#FFFFFF"> 

                      <tbody> 

                        <tr> 

                          <td align="center" valign="top" style="padding:0px 25px 25px;" class="ttgt_pad2"> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0" style="width:600px;" class="ttgt_wrapper"> 

                              <tbody> 

                                <tr> 

                                  <td align="left" valign="top" class="ttgt_dGray" style="font-family:Arial, sans-serif; font-size:16px; line-height:22px; color:#333333;"> 

                                    <div class="mktoText" mktoname="Text" id="body_text_text">

                                      Quisque ac orci non enim laoreet facilisis nec eu nisi elit urna sollicitudin in posuere nec eleifend vitae neque onec mini ante venenatis non sollicitudin id ultricies id magn consectetur molestie tincidunt tincidunt id sapien ac hendrerit congue nisi et urna suscipit nec cursus risus molestie. 

                                      <br /> 

                                      <br /> 

                                      <strong>Vestibulum et sapien:</strong> 

                                      <br /> 

                                      <br /> 

                                      <strong>•</strong>&nbsp; Neque porro quisquam est qui dolorem ipsum quia dolor sit amet 

                                      <br /> 

                                      <strong>•</strong>&nbsp; Lorem ipsum dolor sit amet consectetur quis efficitur eros adipiscing elit 

                                      <br /> 

                                      <strong>•</strong>&nbsp; Aliquam ultrices sodales elit at nulla vestibulum convallis 

                                      <br /> 

                                      <br /> Lorem ipsum dolor sit amet 

                                      <span style="color:#659eba; color:${colorSecondary}; text-decoration:none; font-weight:bold;"><a href="#" target="_blank" style="color:#659eba; color:${colorSecondary}; text-decoration:none; font-weight:bold;">Call To Action</a></span> consectetur adipiscing elit.

                                    </div> </td> 

                                </tr> 

                              </tbody> 

                            </table> </td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Divider: White-1" id="divider_white2"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="#FFFFFF"> 

                      <tbody> 

                        <tr> 

                          <td class="ttgt_height" height="${height}" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Divider: Gray" id="divider_gray824e269d-1ac3-40e4-b219-33604d76669f"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="#FFFFFF"> 

                      <tbody> 

                        <tr> 

                          <td height="1" bgcolor="${colorBackgroundAccent}" style="line-height:0px; font-size:0px;"><img src="https://reg.techtarget.com/rs/095-PCN-759/images/spacer.gif" width="1" height="1" alt="" border="0" style="display:block;" /></td> 

                        </tr> 

                        <tr> 

                          <td height="20" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" class="mktoModule" mktoname="Featured 40/60: Image/Text, White BG" id="featured_40_60_image_text_white_bg4a9c04c9-567c-4534-b4d8-2fc6a7539885"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" class="ttgt_main_table" style="table-layout:fixed; width:650px; background-color:#ffffff;"> 

                      <tbody> 

                        <tr> 

                          <td align="center" valign="top" style="padding:0 25px;" class="ttgt_aside"> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                              <tbody> 

                                <tr> 

                                  <td height="${heightPaddingTop}" style="font-size:1px; line-height:1px;" class="ttgt_height">&nbsp;</td> 

                                </tr> 

                                <tr> 

                                  <td align="center" valign="top" style="background-color:#ffffff;"> 

                                    <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                                      <tbody> 

                                        <tr> 

                                          <td align="center" valign="top"> 

                                            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                                              <tbody> 

                                                <tr> 

                                                  <td align="center" valign="top"> 

                                                    <table width="240" style="width:240px;" border="0" cellspacing="0" cellpadding="0" align="left" class="ttgt_wrapper"> 

                                                      <tbody> 

                                                        <tr> 

                                                          <td align="center" valign="top"> 

                                                            <div class="mktoImg" mktoname="Image (240x180)" id="featured_40_60_image_text_white_bg_image4a9c04c9-567c-4534-b4d8-2fc6a7539885" mktolockimgsize="true">

                                                              <img src="https://reg.techtarget.com/rs/095-PCN-759/images/380x320-Placeholder.png" width="240" height="202" alt="TechTarget" border="0" style="display:block; max-width:240px; font-family:Arial, sans-serif; font-size:15p; color:#00a69f; font-weight:bold;" class="ttgt_img" />

                                                            </div> </td> 

                                                        </tr> 

                                                      </tbody> 

                                                    </table> 

                                                    <!--[if gte mso 9]>

</td>

<td valign="top">

<![endif]--> 

                                                    <table width="360" style="width:360px;" border="0" cellspacing="0" cellpadding="0" align="right" class="ttgt_wrapper"> 

                                                      <tbody> 

                                                        <tr> 

                                                          <td align="center" valign="top"> 

                                                            <table width="360" style="width:360px;" border="0" cellspacing="0" cellpadding="0" align="left" class="ttgt_wrapper"> 

                                                              <tbody> 

                                                                <tr> 

                                                                  <td width="30" style="width:30px;" class="ttgt_hide">&nbsp;</td> 

                                                                  <td align="center" valign="top"> 

                                                                    <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                                                                      <tbody> 

                                                                        <tr> 

                                                                          <td height="0" style="font-size:1px; line-height:1px;" class="ttgt_height">&nbsp;</td> 

                                                                        </tr> 

                                                                        <tr> 

                                                                          <td class="ttgt_dGray" align="left" style="font-family: Arial, sans-serif; font-size: 16px; line-height: 22px; color:#333333; font-weight:bold; padding-bottom:6px;"> 

                                                                            <div class="mktoText" mktoname="Headline" id="featured_40_60_image_text_white_bg_headline4a9c04c9-567c-4534-b4d8-2fc6a7539885">

                                                                              Phasellus id enim semper pellentesque

                                                                            </div> </td> 

                                                                        </tr> 

                                                                        <tr> 

                                                                          <td class="ttgt_dGray" align="left" style="font-family: Arial, sans-serif; font-size: 16px; line-height: 22px; color:#333333; font-weight:400; padding-bottom:14px;"> 

                                                                            <div class="mktoText" mktoname="Text" id="featured_40_60_image_text_white_bg_text4a9c04c9-567c-4534-b4d8-2fc6a7539885">

                                                                              Quisque ac orci non enim laoreet facilisis nec eu nisi elit urna sollicitudin in posuere nec eleifend vitae neque onec mini ante venenatis non sollicitudin id ultricies consectetur...

                                                                            </div> </td> 

                                                                        </tr> 

                                                                        <tr> 

                                                                          <td align="left" valign="top"> 

                                                                            <table style="background-color:#659eba; background-color:${colorSecondary}; border-radius:3px;" border="0" cellspacing="0" cellpadding="0" align="left"> 

                                                                              <tbody> 

                                                                                <tr> 

                                                                                  <td class="ttgt_wht" align="center" valign="middle"><a href="${ctaLink}" target="_blank" style="text-decoration:none; font-family: Arial, sans-serif; font-size: 13px; line-height: 17px; color:#ffffff; font-weight: bold; border-radius:3px; border-left-color:${colorSecondary};border-bottom-color:${colorSecondary};border-right-color:${colorSecondary};color: #ffffff;border-top-color:${colorSecondary};border-left-style: solid;border-bottom-style: solid;border-right-style: solid;border-top-width:1px;display: 

inline-block;border-bottom-width:1px;border-left-width:1px;border-top-style: solid;border-right-width:1px; padding-left: 25px;padding-bottom: 12px;padding-right: 25px;padding-top: 10px; color:#ffffff; line-height:17px; display:block;">${ctaText}</a></td> 

                                                                                </tr> 

                                                                              </tbody> 

                                                                            </table> </td> 

                                                                        </tr> 

                                                                      </tbody> 

                                                                    </table> </td> 

                                                                </tr> 

                                                              </tbody> 

                                                            </table> </td> 

                                                        </tr> 

                                                      </tbody> 

                                                    </table> </td> 

                                                </tr> 

                                              </tbody> 

                                            </table> </td> 

                                        </tr> 

                                      </tbody> 

                                    </table> </td> 

                                </tr> 

                                <tr> 

                                  <td height="${heightPaddingBottom}" style="font-size:1px; line-height:1px;" class="ttgt_height">&nbsp;</td> 

                                </tr> 

                              </tbody> 

                            </table> </td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Divider: White" id="divider_white"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" style="width:650px;" class="ttgt_wrapper" bgcolor="#FFFFFF"> 

                      <tbody> 

                        <tr> 

                          <td class="ttgt_height" height="${height}" style="line-height:1px; font-size:1px;">&nbsp;</td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Footer: Color BG" id="footer_color_bg"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" class="ttgt_wrapper" style="width:650px; background-color:#ffffff;"> 

                      <tbody> 

                        <tr> 

                          <td align="center" valign="top" style="background-color:#5A9876; background-color:#f5f5f5; padding:30px 50px;" class="ttgt_pad"> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                              <tbody> 

                                <tr> 

                                  <td align="center" valign="top" style="padding-bottom:0px;"> 

                                    <table border="0" cellspacing="0" cellpadding="0" align="center"> 

                                      <tbody> 

                                        <tr> 

                                          <td width="30" valign="top"> 

                                            <div class="mktoImg" mktoname="Social Image Twitter" id="footer_color_bg_social_image_right" mktolockimgsize="true">

                                              <a href="${socialLinkTwitter}" target="_blank" style="text-decoration:none;"><img src="https://reg.techtarget.com/rs/095-PCN-759/images/twitter_193x194.png" width="30" height="30" alt="TWTR" border="0" style="display:block; font-family:Arial, sans-serif; font-size:8px; line-height:15px; text-align:center; color:#5c5c5c; font-weight:bold; max-width:30px;" /></a>

                                            </div> </td> 

                                          <td width="10" style="width:10px;">&nbsp;</td> 

                                          <td width="30" valign="top"> 

                                            <div class="mktoImg" mktoname="Social Image Facebook" id="footer_color_bg_social_image_right3" mktolockimgsize="true">

                                              <a href="${socialLinkFacebook}" target="_blank" style="text-decoration:none;"><img src="https://reg.techtarget.com/rs/095-PCN-759/images/facebook_193x194.png" width="30" height="30" alt="FB" border="0" style="display:block; font-family:Arial, sans-serif; font-size:8px; line-height:15px; text-align:center; color:#5c5c5c; font-weight:bold; max-width:30px;" /></a>

                                            </div> </td> 

                                          <td width="10" style="width:10px;">&nbsp;</td> 

                                          <td width="30" valign="top"> 

                                            <div class="mktoImg" mktoname="Social Image LinkedIn" id="footer_color_bg_social_image_right4" mktolockimgsize="true">

                                              <a href="${socialLinkLinkedIn}" target="_blank" style="text-decoration:none;"><img src="https://reg.techtarget.com/rs/095-PCN-759/images/linkedin_193x194.png" width="30" height="30" alt="LNKD" border="0" style="display:block; font-family:Arial, sans-serif; font-size:8px; line-height:15px; text-align:center; color:#5c5c5c; font-weight:bold; max-width:30px;" /></a>

                                            </div> </td> 

                                        </tr> 

                                      </tbody> 

                                    </table> </td> 

                                </tr> 

                              </tbody> 

                            </table> </td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Footer: Color BG-clone" id="footer_color_bgf4a48f35-bfbd-4882-980d-7d67a869203e"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" class="ttgt_wrapper" style="width:650px; background-color:#ffffff;"> 

                      <tbody> 

                        <tr> 

                          <td align="center" valign="top" style=" background-color:#002a3f; padding:30px 50px;" class="ttgt_pad"> 

                            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> 

                              <tbody> 

                                <tr> 

                                  <td class="ttgt_wht" align="left" style="font-family: Arial, sans-serif; font-size: 18px; line-height: 22px; font-weight: bold; color: #ffffff; padding-bottom:10px;"> 

                                    <div class="mktoText" mktoname="Text" id="footer_color_bg_textf4a48f35-bfbd-4882-980d-7d67a869203e">

                                      <p>About the email:<br /></p>

                                    </div> </td> 

                                </tr> 

                                <tr> 

                                  <td class="ttgt_wht" align="left" style="font-family: Arial, sans-serif; font-size: 12px; line-height: 18px; color: #cccccc;font-weight: 400;padding-bottom:20px;"> 

                                    <div class="mktoText" mktoname="Text" id="footer_color_bg_textf4a48f35-bfbd-4882-980d-7d67a869203f">

                                      <div> 

                                        <div>

                                           This email is published by TechTarget Corporate Marketing. Copyright 2023 TechTarget, Inc. All rights reserved. Designated trademarks and brands are the property of their respective owners. 

                                        </div> 

                                        <div> 

                                          <br /> 

                                        </div> 

                                        <div>

                                           When you access content from this email, your information may be shared with the sponsors of that content as described in our 

                                          <span style="color: #8cd4d1;"><a href="http://www.techtarget.com/html/privacy_policy.html" target="_blank" id="" style="color: #8cd4d1;">Privacy Policy.</a></span> 

                                        </div> 

                                        <div> 

                                          <br /> 

                                        </div> 

                                        <div> 

                                          <span style="color: #ffffff; font-size: 12px;"><strong>If you no longer wish to receive these emails, click on the following link:<br /> <span style="color: #8cd4d1; font-size: 12px;"><a href="https://reg.techtarget.com/Corporate-Unsubscribe-Page.html" target="_blank" id="" style="color: #8cd4d1;">Unsubscribe at any time</a></span></strong>. </span> 

                                        </div> 

                                      </div>

                                    </div> </td> 

                                </tr> 

                                <tr> 

                                  <td class="ttgt_wht" align="left" style="font-family: Arial, sans-serif; font-size: 18px; line-height: 22px; font-weight: bold;color: #ffffff;padding-bottom:10px;"> 

                                    <div class="mktoText" mktoname="Text" id="footer_color_bg_textf4a48f35-bfbd-4882-980d-7d67a869203g">

                                      <p>About TechTarget<br /></p>

                                    </div> </td> 

                                </tr> 

                                <tr> 

                                  <td class="ttgt_wht" align="left" style="font-family: Arial, sans-serif; font-size: 12px; line-height: 18px; color: #cccccc; font-weight: 400;padding-bottom:10px;"> 

                                    <div class="mktoText" mktoname="Text" id="footer_color_bg_textf4a48f35-bfbd-4882-980d-7d67a869203h">

                                      <div>

                                         TechTarget (Nasdaq: TTGT) is the global leader in purchase intent-driven marketing and sales services that deliver business impact for enterprise technology companies. 

                                      </div> 

                                      <div> 

                                        <br /> 

                                      </div> 

                                      <div>

                                         ©2023&nbsp;TechTarget 

                                      </div> 

                                      <div>

                                         275 Grove Street 

                                      </div> 

                                      <div>

                                         Newton, MA 02466 

                                      </div>

                                    </div> </td> 

                                </tr> 

                              </tbody> 

                            </table> </td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table>

            <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center" class="mktoModule" mktoname="Footer: Transparent BG" id="footer_transparent_bg"> 

              <tbody> 

                <tr> 

                  <td align="center" valign="top"> 

                    <table width="650" border="0" cellspacing="0" cellpadding="0" align="center" class="ttgt_wrapper" style="width:650px;"> 

                      <tbody> 

                        <tr> 

                          <td class="ttgt_hide" style="line-height:1px;min-width:650px;background-color:#F6F7F7; color:${colorBackground};"><img alt="" src="https://reg.techtarget.com/rs/095-PCN-759/images/spacer.gif" height="1" width="650" style="max-height:1px; min-height:1px; display:block; width:650px; min-width:650px;" border="0" /></td> 

                        </tr> 

                      </tbody> 

                    </table> </td> 

                </tr> 

              </tbody> 

            </table></td> 

        </tr> 

      </tbody> 

    </table> 

    <!--Full width table End--> 

    <!--Increase/decrease the number of (-) as per the template width--> 

    <div class="ttgt_hide" style="white-space:nowrap;font:20px courier;color:#F6F7F7; color:${colorBackground}; background-color:#F6F7F7; background-color:${colorBackground};">

       &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 

    </div>  

  </body>

</html>
Khyra
Level 2

Re: Microsoft Outlook update, 2 column no longer responsive

I came across this thread and can report that the proposed solution worked for my template: 

https://litmus.com/community/discussions/8998-rendering-broken-on-outlook-for-mac-version-16-66