Header background image not responsive; also nav-menu padding question

  • Resolved cindy c

    (@cindy_conlinyahoocom)


    11 years, 3 months ago

    Hi, thanks for your help so far, and for the work on the theme!

    I used a background image on #headercontainer so I could display a large image across the top and have a “header” logo on top of that. I read on one of your other support posts that background images aren’t responsive. Is there a way to make this work? It’s a pages-based website, so I need the large header but also need the logo. My main content area (images and text) doesn’t seem to be responsive either, so I wonder if I removed something important.

    My site: https://djxstation.com

    I also am having trouble removing the top margin (or padding) above the navigation in the banner container. I know it relates to the drop-down menu item, because I’m running 2 other sites with the same child theme, and those sites don’t have any submenus, and the spacing is correct. I think I need to adjust the ‘li .menu-parent-item’ but can’t find it.
    Here are the other 2 sites so you can see the difference in the menu bar:
    https://djxstation.com/wp/autodjpac/
    https://djxstation.com/wp/partisound/

    Thank you for any assistance you are able to provide!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter cindy c

    (@cindy_conlinyahoocom)

    Correction: The other two nav menus are actually off-center (vertical center in banner) as well, it’s just smaller and harder to notice! So maybe it’s not the menu-parent-item class at issue.

    Theme Author Anthony Hortin

    (@ahortin)

    You’re correct, background images aren’t responsive. Your header seems to work fine though, so I’m not sure what you’re actually trying to achieve. When the browser size reduces, your header container still has a background image. You just can’t see it all as obviously it’s wider than the browser width. As far as the height goes, this changes because you’ve added a media query in your child theme stylesheet to change the height when the browser width is 820px or less.

    I’m presuming you’ve sorted out the second part of your question as well as it doesn’t look like there’s any extra padding or margin above the nav that needs removing.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Header background image not responsive; also nav-menu padding question’ is closed to new replies.