Archived topic
Move downwards to "float" above
3 replies · Started by Jono on November 10, 2016
Hi Tom,
I'm trying to move <header> down by 60px, so that page header images appear slightly above <header>.
If I try to use
header {position: absolute;
top: 60px;}
it moves the whole page down by 60px. If I try the same CSS but applied to #masthead or .site-header, it gives me the desired effect except that <header> is then no longer full width. It is shrunken and floats left instead of centered.
Am I missing something? Is there a better way to achieve this? (I'm sure others have tried before me and succeeded!)
Thanks very much for your time!
Site link is http://www-dev.mcb.com.au/our-services/
The Page Header image actually begins below the header, so it's definitely not easy.
You can try this:
.site-header {
position: absolute;
width: 100%;
top: 20px;
}
However it's important to only add that CSS to pages that have a page header image set. You can use Simple CSS to add the CSS to specific pages: https://wordpress.org/plugins/simple-css/
Hope this helps :)
Beautiful! Thanks Tom... I needed that width: 100%.
You're welcome :)