[Resolved] Centering banner ad in header and shrinking image for diff viewports

Home Forums Support Centering banner ad in header and shrinking image for diff viewports

  • This topic has 3 replies, 2 voices, and was last updated 1 year ago by Leo.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1139475
    Charles

    A client has asked me to add a banner ad in the header of a client’s website. The problem is that it looks OK in browsers on a normal desktop resolution, but doesn’t scale gracefully (and stay in the correct spot), when a browser window is a bit less wide than normal. I’ve set this up as a Generate Press element with a hook that displays the image “After Logo.”

    Here is the CSS I currently have, which is based on what I’ve found on the Internet. I’m also open to suggestions as to how to configure a centered banner ad without having to add a new widget area with a child theme.


    @media
    (min-width: 768px) and (max-width: 1024px) {

    .header-banner img {
    max-width: 100%;
    height: auto;
    width: auto;
    margin: auto;
    display: block;
    }

    }

    #1139482
    Leo
    Staff
    Customer Support

    Hi there,

    I would recommend using this method to create your current layout of logo, banner and hours:
    https://docs.generatepress.com/article/split-header-three-sections/

    Let me know if this helps πŸ™‚

    #1139627
    Charles

    Thanks! Thanks for replying so quickly.

    #1139739
    Leo
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.