I used the instructions here to help with the making the header mobile responsive (awesome by the way! helped on another site) http://www.studiopress.com/forums/topic/header-not-resizing-in-mobile-mocha-theme/. It works great on this site for width but height I can't get it to work properly.
I have tried Nick's Genesis Responsive Header plugin on this site but had the same issue in height. Even used the fields to set height in the plugin.
Any suggestions would be appreciated!
Have you tried removing the header image from Appearance > Header and adding it to the stylesheet like we did on your other site? Right now your
background-size: contain !important; rule is being overridden by the Appearance > Header settings.
Thanks for the reply.
I did but changed it back it didn't work. Tried it again since I was really tired when I tried it the first time LOL.
For this theme I had to put it under: #header .wrap
And still can't get the height to work especially on smaller phone screens. Tablet screens it isn't as noticeable.
Any other suggestions? Thanks again for your time.
You've got a min-height of 200px set - that is staying in place at smaller screen sizes because there's no media query to override it. So under each section under Responsive Design or Media Queries, you'll need to add another min-height rule for #header .wrap.
Aha! Thank you! This is starting to make sense now. Appreciate all your help.
You must be logged in to reply to this topic.
Subscribe to get early access to new themes, discounts and brief updates about what's new with StudioPress!