Try this in your child theme:
#masthead {
position: fixed;
margin-left: 0;
margin-right: 0;
width: 100%;
z-index: 1;
}
I tested it in Firebug on your site and it works on my end. It may not play nicely with an admin bar while logged in – you’d need to experiment with it in that case.
Hi Kathryn, thanks.
It works in home page (it works fine also while the admin is logged in), but when I open a post, the header seems to be under the featured image of the post.
Try this: http://www.lebrevistorie.it/lbspre/momenti/la-storia-de-le-brevi-storie/
The header show up when you scroll down.
I put your code in style.css in my child theme.
Thank you for any other suggestions.
Sorry. Other problem in category pages: title (category) is partially hidden by the header.
Try this: http://www.lebrevistorie.it/lbspre/category/viaggi/.
Thanks
It works in home page (it works fine also while the admin is logged in), but when I open a post, the header seems to be under the featured image of the post.
Try this: http://www.lebrevistorie.it/lbspre/momenti/la-storia-de-le-brevi-storie/
Changing the z-index to 2 seems to solve that issue:
#masthead {
margin-left: 0px;
margin-right: 0px;
position: fixed;
width: 100%;
z-index: 2;
}
More about z-index: https://developer.mozilla.org/en-US/docs/Web/CSS/z-index
Other problem in category pages: title (category) is partially hidden by the header.
You can account for that by adding some margin space above the page header on category pages:
.category .page-header {
margin-top: 100px;
}
Learning how to target your site’s CSS will help you make certain design and layout changes. Here are some very helpful posts that will help you customize your site with CSS:
https://dailypost.wordpress.com/2013/07/25/css-selectors/
http://dailypost.wordpress.com/2013/06/21/css-intro/
http://dailypost.wordpress.com/2013/08/29/css-matched-rule-pane/
http://en.support.wordpress.com/custom-design/how-to-find-your-themes-css/
If CSS is new to you, here are some resources for learning more about it:
It works!
Thank you so much for the help and for resources.
Hello Kathryn,
I’m attempting to do the same thing and tried what you suggested above but the images are still being partially hidden by the now stationary header. I tried adding a margin but am not having any luck.
Have a look: http://www.goodislandliving.com
Appreciate any help!
Robbie
Robbie – it looks like your issue is on the homepage, not on category pages like on wladiolo’s site, which is why the code I provided them isn’t working for you.
Try removing this:
.category .page-header {
margin-top: 100px;
}
And instead adding this:
.blog .content-area {
margin-top: 100px;
}
Perfect! thanks Kathryn. I see what I was doing wrong now. Worked perfectly.
