Describe the bug
I'm having an issue with recent version of Outlook 365 adding padding top/bottom on section without background color which shows the body background color.
To Reproduce
Steps to reproduce the behavior:
Create a file with the MJML code above
Render it to HTML
Send the HTML to an email address using outlook 365
See error
<mjml owa="desktop">
<mj-head>
<mj-font name="Roboto" href="https://fonts.googleapis.com/css?family=Lato:400,700,900" />
</mj-head>
<mj-body background-color="#e5ecf4">
<mj-section css-class="slot-section" padding-top="0px" padding-bottom="10px">
<mj-column css-class="slots">
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="center" font-size="12px" line-height="16px" padding-bottom="0px" color="#2b485c">Si vous ne visualisez pas ce mail, <a href="{webview_url}" style="text-decoration:none;color:#057dbc;" target="_blank">cliquez ici</a></mj-text>
</mj-column>
</mj-section>
<mj-section css-class="slot-section" padding-top="0px" padding-bottom="0px" background-color="#FFFFFF">
<mj-column css-class="slots">
<mj-image css-class="slot-image" src="https://go.engie-vertuoz.fr/media/images/logo_vertuoz_185px.png" href="https://engie-vertuoz.fr/" width="185px" alt="Vertuoz"></mj-image>
</mj-column>
</mj-section>
<mj-section css-class="slot-section" padding-top="0px" padding-left="0px" padding-right="0px" padding-bottom="0px" background-color="#FFFFFF">
<mj-column css-class="slots">
<mj-image css-class="slot-image" src="https://go.engie-vertuoz.fr/media/images/head-cover-mailing.png" width="600px" padding="0px" fluid-on-mobile="true" alt="Smart Human"></mj-image>
</mj-column>
</mj-section>
<mj-section css-class="slot-section" padding="40px 16px 10px 16px" background-color="#FFFFFF">
<mj-column css-class="slots" padding="0px 5px">
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="16px" line-height="20px" padding-bottom="0px" font-weight="900" color="#057dbc" padding="10px 0px">
In ut quam vitae odio lacinia tincidunt. Phasellus consectetuer vestibulum elit. Aenean ut eros et nisl sagittis vestibulum. Sed fringilla mauris sit amet nibh.
</mj-text>
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="16px" line-height="20px" padding-bottom="0px" font-weight="900" color="#6ed2b1" padding="0px 0px 10px 0px">
Etiam ultricies nisi vel augue cursus velit. Phasellus magna.
</mj-text>
</mj-column>
</mj-section>
<mj-section css-class="slot-section" padding="10px 16px" background-color="#FFFFFF">
<mj-column css-class="slots" padding="0px 5px" width="35%" vertical-align="middle">
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="84px" line-height="88px" padding-bottom="0px" font-weight="900" color="#fac000" padding="10px 0px">
15%
</mj-text>
</mj-column>
<mj-column css-class="slots" padding="0px 5px" width="65%" vertical-align="middle">
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="16px" line-height="20px" padding-bottom="0px" color="#212121" padding="10px 0px">d'économies d'énergie sont réalisées grâce à l'individualisation des frais de chauffage.
</mj-text>
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="11px" line-height="15px" padding-bottom="0px" color="#212121" padding="5px 0px">Moyenne constatée sur une base de plus de 4000 logements, Source ADEME, 2018.
</mj-text>
</mj-column>
</mj-section>
<mj-section css-class="slot-section" padding="10px 16px" background-color="#FFFFFF">
<mj-column css-class="slots" padding="0px 5px">
<mj-text css-class="slot-text" font-family="Lato, Arial, Sans serif" align="left" font-size="14px" line-height="18px" padding-bottom="0px" color="#212121" padding="10px 0px">
Praesent blandit laoreet nibh. Nullam tincidunt adipiscing enim. Curabitur turpis. Donec vitae sapien ut libero venenatis faucibus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent blandit laoreet nibh.
<br /><br />Nullam tincidunt adipiscing enim ! Phasellus leo dolor, tempus non, auctor et, hendrerit quis, nisi. Quisque id mi. Proin sapien ipsum, porta a, auctor quis, euismod ut, mi. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Vivamus elementum semper nisi.
<br /><br />📱 Nam at tortor in tellus interdum sagittis. Praesent porttitor, nulla vitae posuere iaculis, arcu nisl dignissim dolor, a pretium mi sem ut ipsum. Morbi vestibulum volutpat enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
<br /><br />🎯 Maecenas tempus tellus :
<ul><li>Vestibulum rutrum, mi nec elementum vehicula, eros quam gravida nisl</li>
<li>Id fringilla neque ante vel mi</li>
<li>Pellentesque dapibus hendrerit tortor.</li>
<li>Vivamus quis mi. Duis leo. Vivamus quis mi.</li></ul>
</mj-text>
<mj-button css-class="slot-button" font-family="Lato, Arial, Sans serif" align="center" font-size="16px" line-height="16px" href="https://engie-vertuoz.fr/" inner-padding="20px 20px" background-color="#057dbc" color="#FFFFFF" padding="10px 0px 0px 0px" border-radius="0px">Je souhaite être recontacté(e)</mj-button>
</mj-column>
</mj-section>
</mj-body>
</mjml>
Describe the bug I'm having an issue with recent version of Outlook 365 adding padding top/bottom on section without background color which shows the body background color.
To Reproduce Steps to reproduce the behavior:
Screenshots