Apostrophe 2 Header Image not responsive to mobile

• 

  gaby2991 · Member · Jun 7, 2020 at 9:14 am

  • Copy link
  • Add topic to favorites

  Hi, I’m using the Apostrophe 2 theme. I have a large header image but it’s not responsive on mobile. When I view it on mobile, I only see the word “TO”.
  I’ve tried a couple CSS options I’ve found on here but none seem to do the trick.

  Any help appreciated. thanks!

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

• 

  supernovia · Staff · Jun 9, 2020 at 12:16 am

  • Copy link

  Hi! Here’s what I’d add for your situation:

  .site-branding {
      background-size: contain;
      background-repeat: no-repeat;
  }

  That way no matter the screen size, the image will fit and not repeat. It works well since your background doesn’t clash with the site background, but if you decided to change up your site colors, you could always make the logo as a transparent PNG.

  Hoping this helps!