Jump to content

Overriding code for logo on mobile menu

Recommended Posts

Hello everyone!

I am using a code block for having a different logo on the home page than on the rest of my site. This is working fine on desktop. However, on the mobile nav menu I need the original logo to show because the background is white. Can anyone help with overriding the code on the mobile home nav menu only?

The code I'm using is:

<style>
  header#header img {
    content: url(https://images.squarespace-cdn.com/content/v1/636d0f73e540cf158d3b612a/55792a1c-89a6-4167-bc31-a08815d9f128/AAC_logo_neg.png
      );
}
</style>

 

Also attaching screenshots of the logo on both the home menu and one of the other pages.

Any help on this is greatly appreciated!

Marte

Skjermbilde 2023-01-18 kl. 22.08.52.png

Skjermbilde 2023-01-18 kl. 22.09.07.png

Edited by martelil
Link to comment
  • Replies 1
  • Views 369
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

Change to this code

<style>
@media screen and (min-width:992px) {
  header#header img {
    content: url(https://images.squarespace-cdn.com/content/v1/636d0f73e540cf158d3b612a/55792a1c-89a6-4167-bc31-a08815d9f128/AAC_logo_neg.png);
}}
</style>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.