Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
I have the probem, that the header Image isn’t responsive. Does anyone have a solution for it?
You can see it here: http://www.heathernova.de
Thanks
:-) Heinz
www.heathernova.de
Preface: This reply only applies to Vantage Premium and only really to Heinz’s setup.
Hi Heinz,
As you’re a Vantage Premium user, you’re entitled to priority email support. If you would like to make use of that, please follow the instructions found on this page. Please reference this thread.
Ideally, you should try and keep the logo and masthead background separated the responsive backgrounds are… well they’re weird. Basically, they will retain the aspect ratio no matter what and it’ll crop the image to ensure this.
If you navigate to WP AdminAppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.
@media (max-width: 814px){ #masthead { background-size: cover; position: relative; } .hgroup { padding: 0 !important; } #header-sidebar { padding: 0 !important; margin: 0 !important; position: static !important; } .main-navigation { bottom: -65px; position: absolute; width: 100% }}@media (min-width: 310px) and (max-width: 410px){ .site-header { min-height: 200px; }}@media (min-width: 410px) and (max-width: 480px){ .site-header { min-height: 250px; }}@media (min-width: 480px) and (max-width: 539px){ .site-header { min-height: 300px; }}@media (min-width: 540px) and (max-width: 676px){ .site-header { min-height: 325px; }}@media (min-width: 677px) and (max-width: 814px){ .site-header { min-height: 400px; }}You might also need to install the SiteOrigin CSS Editor.
Oh yes! It works rather fine. Not really 100%. The header image will be cut crop a little bit.
Thanx for your solution.
Heinz
http://www.heathernova.de