heading question

• 

  justsayingmum · Member · Mar 8, 2016 at 9:12 pm

  • Copy link
  • Add topic to favorites

  hi, how do i ensure that my heading JUSTSAYINGMUM stays like this on a mobile format – some mobile users are saying that the last M is gong on to the next line – not really the look i was going for!
  Thank you!

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

• 

  sarahblackstock · Member · Mar 8, 2016 at 10:28 pm

  • Copy link

  Hi there!

  Your site title is wrapping since it’s trying to display on a smaller screen. You could add some CSS to help work around that issue. In Customize > CSS, try this:

  @media screen and (max-width: 700px) {
  .site-title {
  		white-space: nowrap;
  		font-size: 25px;
  }
  }

  You can adjust the max-width number & font-size number until it looks right to you. I checked on an iPhone 6s and that looked good to me, but you should check on your end in case you want to tweak it a bit more.

  Or instead of using the Site Title, you could create a Header Image that you add under Customize > Header Image and your theme will work to automatically adjust the header image’s size for different screen sizes (and since it’s not regular text, it won’t be able to be chopped up like that).

  Let me know if you have any questions! :)