leightorres

This is the custom css I had been using, with details edited to fit my site (sizing, etc). I re-entered it fresh, added my image url, and the dots remained. I started playing around with sizing and for some reason setting the font-size at 2em and margin-top at .01em made the dots disappear. No clue why but I am taking this as a win! I hope this helps someone else. /*Add logo to display in mobile*/ #mobile-navigation-title a { color: transparent; background-image: url("YOUR_IMAGE_URL_HERE"); background-size: contain; background-position: center; background-repeat: no-repeat; font-size: 2.5em; } /*Adjust mobile hamburgernav position*/ #mobile-navigation-label { margin-top: 1em; }

Spoke to Squarespace, they had me remove my custom css and the dots disappeared. That being said, the custom css was for my logo to appear as a header on the mobile site, as the five template does not have that option. So while the dots are gone, so is my logo header. Marked as sort of solved by squarespace.

Here is a screenshot of the dots, mobile version only.

On the mobile site only (not the desktop version) there are three dots on the top right corner of the site. I don't know when they appeared but I can't figure out how to get rid of them. www.cakehero.com Here is the custom code I have for the site:

Marked as solved for the blurry header, but sadly even with the custom code the three dots are still there. .horizontal-navigation-bar nav ul li a { padding: 0 1.2em; } .subnav ul li {padding: 0 0 1px 0; } /*adds vertical space between dropdown menu items in nav*/ .spacer-block { padding: 0 } #mobile-navigation-title { background: url("https://images.squarespace-cdn.com/content/57e17c5f20099e1414d6594c/fd572c66-69cf-440c-b53a-891b869b3b41/LOGO_Horizontal-01.jpg?content-type=image%2Fjpeg") no-repeat center; text-indent: 100%; min-height:60px; background-size:contain; } #mobile-navigation #mobile-navigation-label { background:transparent; color:black; @media only screen and (max-width: 640px) { .banner-content-page-title-description #mobile-navigation-title, .banner-content-empty #mobile-navigation-title { text-overflow: clip; } } }

Wow thank you! The mobile image is now crisp and clear, I so appreciate it. The three dots are still there on the mobile site, it's confusing. I deleted the dummy code but the dots remain. This is the css now: .horizontal-navigation-bar nav ul li a { padding: 0 1.2em; } .subnav ul li {padding: 0 0 1px 0; } /*adds vertical space between dropdown menu items in nav*/ .spacer-block { padding: 0 } #mobile-navigation-title { background: url("https://images.squarespace-cdn.com/content/57e17c5f20099e1414d6594c/fd572c66-69cf-440c-b53a-891b869b3b41/LOGO_Horizontal-01.jpg?content-type=image%2Fjpeg") no-repeat center; text-indent: 100%; min-height:60px; background-size:contain; } #mobile-navigation #mobile-navigation-label { background:transparent; color:black; }

The three dots are on the mobile site only. When I view the mobile site on my squarespace editor they are not there, but they are there in the browser. Where would I upload a mobile specific logo? I can't find that. This is the css I have for the header: .horizontal-navigation-bar nav ul li a { padding: 0 1.2em; } .subnav ul li {padding: 0 0 1px 0; } /*adds vertical space between dropdown menu items in nav*/ .spacer-block { padding: 0 } #mobile-navigation-title { background: url("https://static1.squarespace.com/static/57e17c5f20099e1414d6594c/t/5a6637469140b7e9aa17edcc/1516648262295/LOGO_Horizontal-Narrower-WEB.png") no-repeat center; text-indent: 100%; min-height:60px; background-size:contain; } #mobile-navigation #mobile-navigation-label { background:transparent; color:black; } @font-face { font-family: tuanphan; src: url(upload font & paste font url here); } .menu-section * { font-family: tuanphan !important; }

www.cakehero.com

I have a few issues with the header on mobile for my website. I use the five template. 1. There are three dots at the top right corner at the top of my mobile site that I can't figure out how to get rid of. It just appeared recently, I had made no recent changes to my site. 2. The logo in the header is blurry. It wasn't when I first made my site but has changed over time. I have tried to upload different sizes, custom code, etc and nothing has worked. I have attached a screenshot. Thank you!