pitzki
pitzki

Reputation: 175

Why is the text expanding the cell when I get the test in Outlook?

the text was supposed to break naturally into to 2 lines because the width of the table is 150pxI have an email design in which a line of text ignores the table width. This is happening in the test I get in Outlook.

I tried applying width to various levels of the code, but so far only one thing sort of worked, which is when I set the div width but the text got cut off.

Can you see any errors in this code?

I am using the Marketo 2.0 templates and building on top of them.

<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="150">
  <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; width: 100%;" align="center" border="0" cellpadding="0" cellspacing="0">
          <tbody>
            <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%;font-family:'Fira Sans', Arial, sans-serif;font-weight: 400;font-size: 14px;line-height:20px; border-collapse: collapse;color:#212836; text-align:center;background-color:#f8f8f8;padding:10px"
                bgcolor="#f8f8f8">
                <div class="mktoText" id="articleName2d60440b0-6f64-42a5-ae57-e370b0661ae5" mktoname="Article 2">
                  <a style="color:#212836;text-decoration:underline;">Where Cruise Travel Is Headed Next</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;text-align: center;border-collapse: collapse;line-height:10px;font-size:10px;"
                height="10px">&nbsp;</td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>

Thanks so much!

Edit: Later on, I took the row that contains the div and brought it up one level, eliminating the mid table and that solved the problem. I wonder what piece of code in the middle table was the root of the issue.

Thanks

Upvotes: 0

Views: 84

Answers (0)

Related Questions