Celebrating 7 Years! Get up to $30 off GeneratePress Premium!

[Support request] Big Header Image on Mobile

Home Forums Support [Support request] Big Header Image on Mobile

Home Forums Support Big Header Image on Mobile

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #471012
    Andrew

    I have http://andrewteg.com/wp3/ setup more or less how the header image needs to be on desktop but being a background image it’s giving me fits on mobile sizes. I just used padding to up the size of the header area (.inside-header I believe) and am using a 1920×800 header image. This is meant to be the header and on every page. I’m happy to use page headers but want it up above the primary navigation and not sure the best plan of attack with all the GP options I have 🙂

    I’ve poked around and feel like I’m missing something to get this done right, but can’t find the right combination to get it looking good on mobile sizes. Is there a way to go about this that works for responsive sites that I’m just missing?

    Thanks,
    Andrew

    GeneratePress 2.0.1
    GP Premium 1.5.6
    #471018
    Andrew

    I redid it with http://andrewteg.com/wp4/ which uses <img src="http://andrewteg.com/wp4/wp-content/uploads/2017/12/pexels-photo-237180-800.jpg" /> as content on a Page Header that is merged with header. That keeps the image happy but the spacing I added to the Header (and Container/Content) keep the Primary Nav in the wrong area on mobile. So I keep getting parts right but not the whole, so I’m calling it a night and will wait for the experts to chime in!

    Thanks,
    Andrew

    #471031
    Leo
    Staff
    Customer Support

    Hi there,

    Looks like the issue is the massive padding applied to desktop is also applied to mobile as well.

    Try some CSS like this:

    @media (max-width: 768px) {
        .inside-header {
            padding: 10px;
        }
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.