We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

Hiding logo upon going mobile

August 22, 2021 at 2:11 am #6195
[anonymous]
Hi, I’m using the Taste theme and would like to keep the website’s logo in desktop mode, while hiding it in mobile mode (it currently shows in the header’s center in mobile).

I’ve tried various combinations of the following block of custom CSS with no success:
```
@media screen and (max-width: 20rem) {
    .logo {visibility: hidden;}
}
```
I alternated between max-width/min-width, screen/all/not all/only screen with no success. While the block of code does work on Chrome’s Inspect Element, it doesn’t seem to be applied after I save and preview the custom CSS.
August 22, 2021 at 11:29 pm #6197
[anonymous]
Solved by using pixels instead of em/rem:
```
@media only screen and (max-width:900px) {
  .logo {
    display: none;
  }
}
```
Not sure if this is the correct way to do it though. The rest of the theme seems to be using em/rem in @media switches.