Mobile site title single letter drops a line

  • Hello!

    I have noticed that on Android phones the title of my blog (Stories with Everything) appears with the last letter on a new line.

    On iPhones and iPads this does not seem to be a problem.

    Is there a way of fixing this? Maybe slightly reducing the font size?

    I am asking about my blog https://storieswitheverything.com

    Thank you in advance for your help.

    Naomi

    The blog I need help with is: (visible only to logged in users)

  • Hi there Naomi,

    No problem, we can reduce the font size with Custom CSS.

    I see it on my computer with a narrow enough browser window, by the way, so I don’t think it’s an Android-specific issue. Just an issue with the device width. font size, and amount of text.

    Please try out the following Custom CSS which will reduce the font size once the device width becomes narrower than 650 pixels wide:

    @media (max-width: 650px) {
    	body .site-title {
    		font-size: 42px;
    	}
    }

    Please let me know how that goes for you or if you have any other questions or concerns.

    Best regards,
    Leland

  • Hi Leland

    Thanks so much for getting back to me so speedily – this additional CSS has worked a treat and now the title looks great on my phone.

    Much appreciated,

    Naomi

  • Hi Naomi,

    So glad to hear that! I’ll go ahead and mark this topic as resolved.

    If you have any further questions about Adaline feel free to start a new topic here and I’ll take a look!

    Best regards,
    Leland

  • The topic ‘Mobile site title single letter drops a line’ is closed to new replies.