Archived topic
Small responsive header image problem
7 replies · Started by Tony on August 13, 2016
Hi Tom, thanks for such an awesome theme! I had been having a lot of troubles trying to get my temporary header background image to be responsive and to look the same on desktops, laptops etc., and in looking through the forums I saw where you explained why background images have difficulty with that. So I tried just putting an image into the wp_head hook and that solved it.
But it added a new problem that I haven't been able to solve - it adds a small white space between the bottom of the image and the top of the menu. I have Layout Header padding set to 0.
You can see it at http://amysciostaging.com/
I'm sure there's a simple fix, I just haven't been able to find it.
regards,
Tony
Hi Tony,
wp_head is for scripts only - not HTML.
You'll want to place it in "Before Header" for a similar result.
Let me know :)
Hi Tom,
Thanks, I moved it to "Before Header" but it still has the white space between the image and the top of the navigation bar.
Is there something I can add to my image code or somewhere else that will remove the space?
Regards,
Tony
Try moving it into the "Before Header Content" hook, then add the CSS in this post: https://generatepress.com/forums/topic/problem-with-header-image/#post-208300
Thanks Tom,
That does indeed work but it still has the few pixels of white space under the image.
regards,
Tony
Add this CSS as well:
.inside-header img {
vertical-align: bottom;
}That did it! Thanks so much!
Tony
You're welcome :)
