Bold Headline
[resolved] My header image is hidden on small screens (5 posts)

  1. murf2020
    Posted 2 years ago #

    Hello. I created a child theme to make a few changes. I added the following CSS so that I could insert a smaller image for the header that wouldn't resize too large:

    max-width: 350px;
    max-height: 68px;
    padding: 0;
    margin-bottom: 0;
    margin-top: 0;

    The trouble is that the header just shows a square outline (no image) at the left side when viewed on iphone screen. Any suggestions would be appreciated.

    Here is a link to the site:

  2. Christine Rondeau
    Volunteer Forum Moderator
    Theme Author

    Posted 2 years ago #

    Sorry, but I don't understand. When i go to your website and resize my browser, the image - http://www.artkorner.com/wp-content/uploads/2014/02/cropped-logo_site.bmp shows up.
    Is this the one you mean?

    I also looked at your site on my iPhone and it's fine. I see the image as it should be.

  3. murf2020
    Posted 2 years ago #

    I'm sorry,

    I should have checked it on someone else's phone before I posted this. Now that you've pointed it out I realize it is something to do with my iPhone. I have an older 4s. I'll check a few other devices, but if you have any ideas why I might be having this problem on my iPhone 4s i'm open to suggestions. It does it in landscape and portrait orientation on my phone. Here's a screenshot.


  4. Christine Rondeau
    Volunteer Forum Moderator
    Theme Author

    Posted 2 years ago #

    I wonder if it's because your logo is a bmp file.
    Maybe you need to use a gif or jpg?

    Or maybe try using width and height instead of max-width or max-height.

  5. murf2020
    Posted 2 years ago #

    Thank you so much! I tried width/height first, but that didn't work. So I tried re-adding the image as a jpeg and that took care of it! Awesome!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic