html - Formatting email layout issue Outlook 2013 - Windows 7 -


i have modified email template (from campaign monitor) responsive , works on email browsers.

but, email header running formatting issues on outlook 2013, windows 7.

i have messed formatting inline , using css attempt find solution.

correct email

enter image description here

outlook 2013, windows 7

enter image description here

i have created jsfiddle review html code: https://jsfiddle.net/jeremyccrane/wz4ly555/

    <!--[if mso]> <body class="mso">   <![endif]-->   <!--[if !mso]><!-->   <body class="half-padding" style="margin: 0;padding: 0;min-width: 100%;background-color: #e7e7e7;">     <!--<![endif]-->     <center class="wrapper" style="display: table;table-layout: fixed;width: 100%;min-width: 620px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;background-color: #e7e7e7;">       <table class="header centered" style="border-collapse: collapse;border-spacing: 0;margin-left: auto;margin-right: auto; width: 600px;">         <tbody>           <tr>             <td style="padding: 0;vertical-align: top;">               <table class="one-col" style="border-collapse: collapse;border-spacing: 0;margin-left: auto;margin-right: auto;width: 600px;background-color: #ffffff;table-layout: fixed;" emb-background-style>                 <tbody>                   <tr>                     <td class="column" style="padding: 0;vertical-align: top;">                       <table class="contents" style="border-collapse: collapse;border-spacing: 0;table-layout: fixed;width: 100%; background:#ee3524;">                         <tbody>                           <tr>                             <td class="remove-padding" style="padding: 0;vertical-align: top;padding-left: 0px;padding-right: 0px;word-break: break-word;word-wrap: break-word;">                               <div class="image" style="font-style: normal;font-weight: 400;margin-bottom: 0;margin-top: 0;font-family: sans-serif;color: #000;" align="center">                                 <img style="border: 0;-ms-interpolation-mode: bicubic;display: block;" src="https://www.dropbox.com/s/bif26pxsl39mv5u/header.png?raw=1" class="" width="600px"/>                               </div>                             </td>                           </tr>                         </tbody>                       </table>                     </td>                   </tr>                 </tbody>               </table>             </td>           </tr>         </tbody>       </table>     </center> </body> </html> 

outlook2013 litmus test

i tested html jsfiddle in litmus, , seems oke.

can more explain how 2 red area's


Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -