Hamburger Icon Spacing Off

  • I created a child theme for the Motif theme, but did NOT change anything with the menu’s css just yet. I noticed when the menu becomes responsive, the “hamburger” icon is a bit off in it’s bar spacing. Top bar is fine, but middle bar is close to the bottom bar, it looks odd.

    I came across This Thread, but wanted to continue using Genericons method.

    Is there anyway to fix this spacing with Genericons /f419?

    NOTE: I cannot post a link because I am using WAMP locally.

Viewing 5 replies - 1 through 5 (of 5 total)
  • sacredpath

    (@sacredpath)

    Automattic Happiness Engineer

    Hi there, since your site is currently on WAMP and not where I can see it, I’m a bit at a loss on this. Since the menu hamburger icon is Genericon \f419, the three bars are set in the Genericon font icon. I enlarged the font icon on the Motif demo site to 6rem from 1.0769rem and do not see any difference in spacing on the three bars. Can you take a screenshot and upload it somewhere and then give us a link?

    Thread Starter xmatter

    (@xmatter)

    At first I though it may have been a monitor issue, some fonts look terrible on certain monitors and browsers. I tried several different computers and browsers, same issue. HERE is a screenshot of what I am talking about.

    Hmm – that screenshot doesn’t look like Motif’s default mobile menu, which doesn’t have rounded edges and is grey, not blue:

    Motif A crisp minimalist and fully responsive business theme

    If you activate the parent theme, do you see the same thing?

    Thread Starter xmatter

    (@xmatter)

    I removed the child theme from the template directory and activate the default Motif theme, same results.

    Before posting on the forum, I copied genericon files from the expound theme, still same result.

    Definitely odd. Are you running version 1.0.11 of Motif?

    The Motif demo site does not have that blue background colour, rounded tab borders, nor the spacing issue on the hamburger icon:
    https://wp-themes.com/motif/

    Once you get your site up on a remote dev server, feel free to let me know and I’d be glad to have a look directly to see if we can figure out what’s going on.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Hamburger Icon Spacing Off’ is closed to new replies.