Mobile header image

  • Hello, the header image is too big on an iphone. How can I make the header image responsive, so that it adapts to mobile phone view? It looks ok in the Customise preview but when I press Publish, the image is too big for the phone view.

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Theme Author Carolina Nymark

    (@poena)

    Hi
    Thank you for reporting this.
    I dont own an iphone, only a samsung, and the image looks the same for me in both views.

    -Are you using the default header image? If not, what size is your image?
    -Does it look too wide or too tall?

    Thread Starter tuftwax

    (@tuftwax)

    I’m using the following css from a previous post:

    @media screen and (max-width: 782px) {
    .site-header {
    display: inline-block;
    }
    .responsive-site-title,
    .responsive-site-description{
    display:none;
    }
    }

    I had taken it out but I have just re-inserted it, so that you can see.

    The header media image is 1900 × 1267. It looks way to big on mobile. Though, on desktop it’s perfect and when I adjust the desktop view it acts responsively and adjusts to the window size. However, on mobile it’s as though it stays at it’s original resolution, thus doesn’t fit with the rest of the page.

    Thanks

    Theme Author Carolina Nymark

    (@poena)

    Oops I mixed the topics up:

    Remove the custom css and activate the advanced header option in the customizer.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Mobile header image’ is closed to new replies.