Best Of

@heidiannemorris said:
Hi Mike, thank you

I know what I did now, I understand - I thought I could include that text (remove the margin/padding from all 3 widgets (logo, text and menu) as a note to myself in the future to remind me what the code below it was about. I didn't realise what effect that had. Apologies.

If you want to include those notes, you just need to wrap those with these: /* */. So as an example: /* A Note Here */.

The changes have caused a gap to appear in the opaque overlay at the bottom of the screen on mobile.

Could you kindly advise how I make the opacity fit the screen right to the bottom (prior to the menu being expanded) on all mobile devices please?

If you're talking about the "gap" under the last menu entry (Lots more links), that's how it's supposed to work. If that isn't what you're talking about, then I don't understand your question.

You didn't copy the code correctly.

First you need to remove the margin/padding from all 3 widgets (logo, text and menu) by adding this to your custom CSS:

@media screen and (max-width: 736px) {

  .sm-page-widget.sm-page-widget-6867720 .sm-page-widget-content,
  .sm-page-widget.sm-page-widget-27203962 .sm-page-widget-content,
  .sm-page-widget.sm-page-widget-5256509 .sm-page-widget-content {
    padding:0 !important; 
    margin:0 !important;
  }

}

Now you may like where your hamburger icon is now, but if you want it more "centered", you need to edit this line: top: -90px;/* adjust for your logo */. Try -80px.

I'm not familiar with SquareSpace, but I do know WordPress. I use WP for my website only using SM for my galleries. IMO, WordPress is WAY better SEO-wise than SM. Sorry SM. One big negative I see for SmugMug is there is no way to have a page title <h1> and have a separate title element (The one that shows up in the browser). Using a SEO plugin in WP is simple.