title padding on mobile

  • Hi

    In my post grid (showing recent posts) on my homepage the title for the blogs are not configured properly for mobile i.e. letters are being split on different lines, without keeping the words together.

    Here is the link to this page: https://yyande.com/

    This also happens at the bottom of a post under “related post”. For example, the title “What even is Chassidus” is split incorrectly on mobile. Here is the link to this page: https://yyande.com/your-happiness-is-in-your-hands/

    The above is NOT a problem on the posts page or the “recent posts” widget in the footer.

    I am a novice to website building. Any number/measurement I have inserted in the padding section for the title doesn’t seem to help. Please help me fix this!

    Thanks so much!

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hello
    Please add the below CSS codes on Appearance > Customize > Additional CSS. Hope this will fix the issues.

    h3.gutentor-single-item-title {
    margin-bottom: 20px;
    }
    @media (max-width: 480px) {
    .related-posts .show-2-related-posts {
    float: left;
    width: 100%;
    padding: 0 15px;
    }
    }

    Thread Starter Yosef Yitzchak Sher

    (@yyande)

    Hi there

    Thanks so much!

    I tried, but still hasn’t fixed the main problem of the title within the post grid block.

    See screenshot here https://snipboard.io/Nqh65J.jpg

    The related posts are fine now thank you!

    Hello
    Please add the below CSS codes on Appearance > Customize > Additional CSS. Hope this will fix the issues.

    h1, h2, h3, h4, h5, h6 {
    word-break: normal!important;
    }

    Thread Starter Yosef Yitzchak Sher

    (@yyande)

    Thank you so so much! This fixed the problem BH ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘title padding on mobile’ is closed to new replies.