- This topic has 4 replies, 2 voices, and was last updated 4 years, 11 months ago by
.
-
Posts
-
Hello,
I’d like to align my header image to be directly above my first menu item (Home). I want the image to stay fixed above the first menu item even when the window is minimized/resized. I also do NOT want to affect the position of the search box.
My website is: http://www.apgardnerposthamilton.org
Below is some custom CSS that I already have. (I want to keep the site identity margin to control the height of the header)
—-
@media(min-width:768px){
#site-identity {
margin-top: 80px;
}
#masthead {
background-position: left;}
}—-
I have updated my css (unrelated to this issue) and posted the latest below.
Just to recap my issue… I want to move the header image to align with the first menu item without affecting the position of the search box. Using a margin-left attribute in #masthead moved the search box and the header still moves too much when the window is resized as well.
#site-identity {
margin-top:80px;
}
#masthead {
background-position:left;
}@media(max-width: 769px) {
.site-header {
min-height: 0px;
}#page #masthead {
padding-bottom: 0px;
}
}
@media only screen and (max-width: 479px) {
#page #masthead {
padding-top: 0px;
}
}Hello @DB4Y
To solve your issue using CSS is bit tedious so in order to solve the issue we prefer the child theme approach.
At first create the child theme . For creating the child theme you can refer to below link:
https://codex.wordpress.org/Child_Themes
You can also create the child theme using plugin. As there are many such plugin, below is one of them.
https://wordpress.org/plugins/wp-child-theme-generator/
After creating and activating the child theme paste below code in your child themes functions.php file.
function education_hub_header_start() { $extra_class = ''; ?> <div class="container"><div class="row"><header id="masthead" class="site-header" role="banner"> <?php } function education_hub_header_end() { ?></header><!-- #masthead --></div><!-- .row --></div><!-- .container --><?php }Hope this helps.
If this does not solve your issue please let us know.
Best Regards!!
This didn’t work. It actually messed around with my entire layout. Widgets were removed, the layout was changed, certain data was set to default, etc. When I deactivated the plugin and restored the regular pro theme the issues remained. I ended up having to restore a database backup to get my site back prior to the changes. Did I do something wrong? Anyhow, I’ll change my header image size to the recommended or just use the site logo/title instead. Thank you anyway.
@db4y,
It would have really been easy to provide the direct solution if we could see the current issue in some form like screenshot or your site URL (currently seen in construction phase). We are finding our way to get straight to your issue in short time without waiting much time in issue understanding. Let us know how we can help you further.
Thank you.
- You must be logged in to reply to this topic.
