Archived topic
Disable the header on mobile for posts
5 replies · Started by Prajwal on July 5, 2021
Hi,
I am trying to disable or hide the header on mobile for posts. I am looking to hide the mobile header only for posts. I am using the below code but no luck so far.
@media(max-width: 768px) {
body.single #mobile-header {
display:none !important;
}
}Hi there,
Can you link us to the page in question? So I can inspect if the selector used is correct.
You can provide the link on the private information text field. :)
Example
Thanks.
Your site doesn't seem to have Mobile Header enabled on the customizer settings so it won't be using #mobile-header selector.
It's using nav#site-navigation for both desktop and mobile.
If you wish to hide the navigation on mobile, you can try this CSS:
@media(max-width:768px){
nav#site-navigation {
display: none;
}
}Hi, this code disables the header on pages as well. I want to hide the header only on blog posts.
Change:
nav#site-navigation
to
.single-post nav#site-navigation
