How can I fix my logo not showing on mobile header?

Topic summary

A user encountered an issue where their logo displays correctly on desktop but disappears on mobile after implementing a dual-logo header design (one logo on each side).

Problem Details:

  • Two logos show on PC/desktop
  • Only one logo appears on mobile
  • User wants both logos on desktop but only one visible on mobile

Solution Provided:
Another community member shared CSS code to hide the second logo on mobile devices:

@media screen and (max-width: 989px){
  .logo-header-second {
    display: none !important;
  }
}

This code should be added to the bottom of the base CSS file.

Status: Resolved - the original poster confirmed the solution worked and thanked the helper.

Summarized with AI on November 23. AI used: claude-sonnet-4-5-20250929.

My logo shows up on my header on pc but not on mobile, this has happened ever since I switched to 2 logos one on each side. How am I able to fix this thank you.

JeffRandal1238_0-1673657981770.png

I just want 1 to show up on mobile and heres my store link: https://onlymanagers.myshopify.com/

remove the second logo

Yes I know that but I want 2 on pc but only one on phone. Is there a way I can remove it only on mobile?

@media screen and (max-width: 989px){
.logo-header-second{display:none !important;}
}

Put this at the bottom of base.css

Thanks for the help!