[resolved] Header Image Messed Up on Mobile and Tablet (7 posts)

  1. willfan09
    Posted 1 year ago #

    I am running Expound Theme and everything on desktop is running excellent. Really nice Theme! My issue is with tablets (specifically ipad) and mobile (Iphone).
    On Iphone, the header image is huge and cut off on both the right and left side. Also, the "site title" and "description" are not "hiding", meaning they are showing up on top of my header image. Here is an image of what it looks like on my iphone.
    On Ipad, the header image is slightly cut off on left side and "site title" and "description" are not hidden and are showing through my header image. Here is an image of what it looks like on my ipad.
    I am a noob but have created a child theme and have been learning a bit on altering the CSS.Style sheet. Any help fixing this issue would be greatly appreciated.

  2. matatias
    Posted 1 year ago #

    I think you'll need to create more images to fit the different sizes of the header. Look for this line in the CSS file
    Below that you'll find alternate styles so the theme can fit in smaller screens. Then you can add the backgrounds with properly sized images to different screen sizes. I'm editing the CSS because I learned about Child Themes too late, but I think it's possible to do that in a Child Theme.
    Maybe there's another way to do that using a single image, but I don't know how to do that using CSS.

  3. willfan09
    Posted 1 year ago #

    Have tried a few different @media requests unsuccessfully. Will keep trying different ideas though. So are you certain I can point my mobile to a different properly sized image? I'd be willing to attempt that..

  4. matatias
    Posted 1 year ago #

    Actually, it's the theme that identifies the width of the screen and select what CSS to use. The theme already does that, so you'll add more instructions on what to do when the screen is smaller.

  5. willfan09
    Posted 1 year ago #

    I will work on this. thanks!

  6. dongermibbs
    Posted 1 year ago #

    Any joy on this, I'm having the same issue. On mobile phones my banner is just a slice of what the actual banner is.

    What sizes should I resize my banner too and where should each individual banner be placed in wordpress.

  7. Farrahv
    Posted 8 months ago #

    The logo banner image on my site is really large on mobile devices and tablets. It extends off the side of the page. It looks fine on the computer though.

    Can someone please help me with this issue!!

    My website is: http://www.23fourclothing.com

    Thank You

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic