Skip to main content

Notifications

Customer experience | Sales, Customer Insights,...
Suggested answer

Text padding in mobile

(0) ShareShare
ReportReport
Posted on by 160

Hi all,

I've created an email with:

p {
margin: 0px 0px 0px 0px;
padding: 10px;
line-height: auto;
mso-line-height-rule: at-least;
}
This because then the text box gets more space (padding 10px). Ofcourse it gets the same result in mobile version. But is it possible to change the text padding only for mobile? 
10px for desktop and 0px for mobile (because the spacing gets very big in mobile).
Thanks
  • Filippa f Profile Picture
    Filippa f 160 on at
    RE: Text padding in mobile

    Is it possible to add line height option? Maybe as a meta tag?

  • OlehYaruchyk Profile Picture
    OlehYaruchyk 30 on at
    RE: Text padding in mobile

    Everything is correct. But don't work. Unfortunately

  • Filippa f Profile Picture
    Filippa f 160 on at
    RE: Text padding in mobile

    I don't know if i put it wrong in the CSS, but unfortunately I can't make your solution work.

  • OlehYaruchyk Profile Picture
    OlehYaruchyk 30 on at
    RE: Text padding in mobile

    This is the whole class for mobile. If you want to change only for the P, please try my variant

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

    p {

    margin: 0px 0px 0px 0px;

    padding: 0px;

    line-height: auto;

    mso-line-height-rule: at-least;

    }

    }

  • Filippa f Profile Picture
    Filippa f 160 on at
    RE: Text padding in mobile

    Hi,

    <style>
    a { text-decoration: none;
    }
    a { color: #0fb1c1; } /* CSS link color */
    body {
    font-family: /* @font-family */ Arial, verdana, sans-serif /* @font-family */
    ;
    font-size: /* @body-text-size */ 13px /* @body-text-size */
    ;
    color: /* @body-text-color */ #1d1e1d /* @body-text-color */
    ;
    background-color: /* @outer-background */ #f1f5f3 /* @outer-background */
    ;
    }
    div {
    background-color: transparent;
    }
    [data-layout="true"] {
    margin: 0 auto;
    max-width: /* @layout-max-width */
    600px/* @layout-max-width */
    ;
    }
            #outlook a{
                padding:0;
            }
            img{
                -ms-interpolation-mode:bicubic;
            }
            table{
                mso-table-lspace:0pt;
                mso-table-rspace:0pt;
    p {
    margin: 0px 0px 0px 0px;
    padding: 10px;
    line-height: auto;
    mso-line-height-rule: at-least;
    }
    p img, ol img, ul img {
    max-width: 100%;
    }
    a {
    text-decoration: none;
    }
    u a {
    text-decoration: underline;
    }
    .imageWrapper a img {
    text-decoration: none;
    border: 0px;
    }
    @media only screen and (max-width: 768px) {
    .columnContainer {
    width: 100% !important;
    padding: 10px 0px !important;
    box-sizing: border-box;
    margin-left: 0px !important;
    margin-right: 0px !important;
    }
    .containerWrapper {
    display: block !important;
    }
    .columnContainerWrapper {
    min-height: 70px !important;
    }
    a span {
    line-height: inherit !important;
    }
    }
    </style>
  • Suggested answer
    OlehYaruchyk Profile Picture
    OlehYaruchyk 30 on at
    RE: Text padding in mobile

    Hi, I don't see the whole code, please try this variant

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

    p {

    margin: 0px 0px 0px 0px;

    padding: 0px;

    line-height: auto;

    mso-line-height-rule: at-least;

    }

    }

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Announcing Our 2025 Season 1 Super Users!

A new season of Super Users has arrived, and we are so grateful for the daily…

Announcing Forum Attachment Improvements!

We're excited to announce that attachments for replies in forums and improved…

Vahid Ghafarpour – Community Spotlight

We are excited to recognize Vahid Ghafarpour as our February 2025 Community…

Leaderboard

#1
André Arnaud de Calavon Profile Picture

André Arnaud de Cal... 291,979 Super User 2025 Season 1

#2
Martin Dráb Profile Picture

Martin Dráb 230,848 Most Valuable Professional

#3
nmaenpaa Profile Picture

nmaenpaa 101,156

Leaderboard

Featured topics

Product updates

Dynamics 365 release plans