CMS Development

chainrelations
Member | Elite Partner
Member | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

Hey,

 

we noticed some NEW bugs in our new HubSpot template which we order by hubspot a few month ago. It seems like the paddings and width regulation is not clear in the template.

 

Could somebody help me with this? I need help to fix this 🙂

 

Attached are two Screenshots from Outlook 2016 and 2019!

 

Thanks a lot

Paulina

 

Outlook 2016 120 DPI (Windows 10).pngOutlook 2019 120 DPI (Windows 10).png

0 Upvotes
1 Accepted solution
alyssamwilie
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

@chainrelations

For the padding on the heading text - the spacer above it doesn't have any content inside it so certain versions of Outlook pretend it's not there at all. I added a &nsbp; inside it to make Outlook aknowledge it. From the code it looks like you're using a Hubspot spacer module, so if you're using Drag and Drop instead of a HTML template you would need to clone that module to edit it to add the fix.

 

For the gray bar - the other sections use 100% width throughout while the gray bar has set widths. Therefore on DPI versions while the other sections are scaling up the gray bar section is retaining it's original width. I changed all the 534 and 590px widths in that section to 100% and added left and right padding to the top-most table cell.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.

View solution in original post

5 Replies 5
alyssamwilie
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

@dennisedson 🤣

 

@chainrelations Yea, would need to see the code to get a better idea of what's going on. At a glance though the heading spacing could be that you're using margin (it doesn't have great support in Outlook)? And for the MailStore bar possibly missing a set width somewhere.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
chainrelations
Member | Elite Partner
Member | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

Hey Alyssa,

 

for sure - can you send me your email? the code is too long and it's not possible to attache my code in here 🙂

 

Thanks a lot & Best

Paulina

0 Upvotes
alyssamwilie
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

@chainrelations

For the padding on the heading text - the spacer above it doesn't have any content inside it so certain versions of Outlook pretend it's not there at all. I added a &nsbp; inside it to make Outlook aknowledge it. From the code it looks like you're using a Hubspot spacer module, so if you're using Drag and Drop instead of a HTML template you would need to clone that module to edit it to add the fix.

 

For the gray bar - the other sections use 100% width throughout while the gray bar has set widths. Therefore on DPI versions while the other sections are scaling up the gray bar section is retaining it's original width. I changed all the 534 and 590px widths in that section to 100% and added left and right padding to the top-most table cell.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
alyssamwilie
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

Bugs in Template Outlook 2016 2019

SOLVE

Sure, I'll DM you.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Upvotes
dennisedson
HubSpot Product Team
HubSpot Product Team

Bugs in Template Outlook 2016 2019

SOLVE

Hey @chainrelations 

Could you post the code to the template here? 

@alyssamwilie , everytime I see email, your name comes to mind 😀 

0 Upvotes