Jump to content

My custom mobile hamburger icon is not centered in the invisible hamburger box, how do I fix this?

Recommended Posts

Hello, I'm working on my new website and I've got my own little thing that I want as a mobile hamburger menu icon.

My problem is it does not center in the bounding box (term?), how do I fix this?

Image for reference:


Icon image adress:


CODE I'm using right now:

.burger-inner:after {
    content: "";
    background-image: url(https://i.imgur.com/DcVdG9q.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left;
    background-color: transparent !important;
    display: block;
    width: 30px;
    height: 30px;
.burger-inner:before {display:none;}

Thanks before hand,


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


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.