Streamline Responsive Header Issue

[dmperry24]

This is my website URL:  http://www.rexboatingclub.com/blog/
I am using the Streamline theme. I want to have a media responsive header, and I have gotten that to work to a degree. When I first created the site I used the header custom loader to load my header image. I set the size of the header in "functions.php" to be 960 wide by 282 high using this code:

/** Add support for custom header */
add_theme_support( 'genesis-custom-header', array( 'width' => 960, 'height' => 120 ) );

And added the header image with the upload program in the theme. Unfortunately this causes the 960 x 282 space to be permanently blocked off, yet the header images resize according to my media queries, which makes the whole thing look odd.

Here is my CSS ("style.css") for the header as it stands now:

#header {
-moz-box-shadow: 0 0 10px #111;
-webkit-box-shadow: 0 0 10px #111;
background-color: #fff;
box-shadow: 0 0 10px #111;
margin: 0 auto;
height: 282px;
overflow: hidden;
width: 960px;
}

Should I put the following code in the header block to have my header image appear as a background image as I have the @media queries set up for the other two images I'm using:

#header {
background: url(images/RexBannerBC-NewVersion.png) no-repeat !important;
}

If I put it in the Responsive Design section, the header image doesn't show until my screen shrinks to about 960px wide. Then it works properly except there is a bunch of space allocated for the header image  of 960 x 282 that will not change size as the screen gets smaller in various phones, etc. What do I do?

[dmperry24]

As an update, I have switched to the Agency theme, because the design fits my ideas much better, and though I am taking it slow develeoping this one, I believe I have the same issue with header responsive sizing here as well. All the numbers are similar to what is posted above, but there seems some hard-coding that is making the header less than responsive.

[Antonios]

I'm having the same issue.  my header image resizes but the header remains same height as full size site.  in my functions.php I  have this line

/** Add support for custom header */
add_theme_support( 'genesis-custom-header', array( 'width' => 960, 'height' => 100 ) );

css file can be found here: http://pastebin.com/61zVUPR5

---

Antonios @AntoniosHadji
FueltheBodyWell.com

[Author]

Posts