Jump to content

CSS Stops working once site is published

Recommended Posts


I have custom css to create a burger menu on desktop. This works while the site is in edit mode, however as soon as it is published, the burger menu displays but will not open the nav bar menu. Any help is appreciated! Code below:

EDIT: Upon further inverstigation, it is the JS below that breaks the menu, it works without the menu being moved next to the language picker.

@media only screen and (min-width: 760px) {
 	.header-burger {
      	margin: 12px!important;
	.header-nav {display:none!important}
	.header--menu-open .header-menu {
      display: flex!important; 
      opacity: 1!important; 			  
	.header-menu-actions {
      display: none;
  	.header-menu-cta {
		display: none;
	.header-menu-nav-item a {
    	font-size: 45px;
    	line-height: .8;


  $(document).ready(function() { 
		$('.header-display-desktop .header-burger').insertAfter('.language-picker-desktop');


Edited by Cancid
Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

  • 4 weeks later...
On 2/10/2023 at 4:31 AM, Cancid said:

Oh gosh, so sorry I didn't include it and the late response. It is okapiconservation.org

Thanks @tuanphan you're a legend!


It is fine to me. Click burger >> still open menu.

You can check again

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 3 weeks later...

Hey @tuanphan,

It does open rn on the live site, however we original had it moved over to be left of the "Contribute" button. I can successfully move it there and it works while the site is in edit mode, however on the live site the button becomes unclickable.

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.