Jump to content

SVG logo disappearing in mobile on WAV template

Recommended Posts

Hi there!

My svg seems to be disappearing on mobile in WAV template. The technique described by @daviddurbin on forum works great for desktop and tablet (uploaded transparent svg, added svg file, added custom css) but I'm at a loss for the mobile solution.

Here's my css:

.Header-branding {background-repeat: no-repeat;background-image: url(https://static1.squarespace.com/static/5d61e8939d1fc100018a3a88/t/5d64a186fed11f00015284f7/1566876038294/Tailgate+logovertical_orange.svg);}

Hoping someone has an easy fix or media query solve for this! Thanks for any help.

Link to comment
  • Replies 1
  • Views 769
  • Created
  • Last Reply

Hi again!

One additional change to the css seems to get the svg to show up by styling the class .mobile-bar-branding:

.Mobile-bar-branding {background-repeat: no-repeat;background-size: 130px;background-image: url(https://static1.squarespace.com/static/294.../_my logo name.svg);}

alt text

However, I can't seem to make the logo (or the div holding it) larger. Looks like there's three divs in there: top left, top center, top right. The top center holds the SVG, but I can't get it to be wider. I tried hiding .top-left and .top-right with visibility: hidden, no luck.

I also tried styling .mobile-bar-branding with background-size: 130px; and got this:alt text

Any help is greatly appreciated!

screen-shot-2019-08-28-at-103527-am.png.bcb4692763d2c9b2481acea96ae3289e.png

screen-shot-2019-08-28-at-102535-am.png.608bd504fe555d9b8e815f6f16f58ca5.png

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.