Archived topic
How to hide the sidebar only in mobile view
9 replies · Started by Zipeng on July 10, 2018
I want to disable my right sidebar on the mobile view only. and show up at the desktop view. How can I do that?
Hi there,
you can use this CSS:
@media (max-width: 768px) {
#right-sidebar {
display: none;
}
}
Hi David,
I want the same thing. I add the css code on my blog my-wildlife.com but it doesn't work. Any idea why ?
Gregory
Hi there,
where are you adding the CSS ?
Hi David,
On the "additionnal css" menu (it's a transmation of my french menu so the english name can be a little bit different) = > ../wp-admin/customize.php?url=https%3A%2F%2Fwww.my-wildlife.com%2Fparc-ornithologique-de-pont-de-gau%2F
Hi there,
As far as I can tell, the sidebar is gone on mobile.
Have you cleared your browser cache?
Let me know :)
Yes, I cleared the browser cache.
On mobile, the sidebar is under the central part of my articles.
You can check for example on the article https://www.my-wildlife.com/ou-faire-un-safari-au-kenya/
Gregory
Aah now i can see the CSS - the problem is this comment:
// pas de sidebar en mode mobile
Its an invalid comment for CSS and will break any code that comes after it.
CSS comments have to be wrapped in /* */
So it should be:
/* pas de sidebar en mode mobile */
Thanks David for your help. It works and I learned something today.
You're welcome.
As a note:
// this comment is fine for PHP and Javascript