• Resolved 2kwarrior

    (@2kwarrior)


    When viewing Twenty Seventeen on a mobile device or smaller screen and the menu changes to the responsive Menu stack image, the image is huge. It looks like the containing element size is too big as the element which is the svg looks to be inherited. Any ideas on how to fix this?

Viewing 5 replies - 1 through 5 (of 5 total)
  • have you made any edits to the theme, or via additional CSS?

    can you post a link to your site to illustrate the problem?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    We need to see your website.

    Thread Starter 2kwarrior

    (@2kwarrior)

    I determined the problem.

    It seems font awesome looks for icon classes and uses auto height and width for them.

    The latest version of twenty Seventeen looks to use font awesome and the button element which parents the svg element for the responsive Menu has no size nor does anything until you get to the navigation div. This makes it big.

    I had to add custom css for icon to correct this. It was actually broken on several font awesome icon usages. Menu hamburger, close icon, folder icon for post categories.

    This was stock theme provisioned for WordPress on Azure. I would have to disable the custom css so you can see the before.

    I will do this so you can see.

    I even removed the the theme and reinstalled thinking it was some provision problem. I then compared other installs that looked to be working on older versions of the theme and the had an icon class in style.css with height and width of 1em.

    Graceumc.azurewebsites.net

    Thread Starter 2kwarrior

    (@2kwarrior)

    I disabled another plugin which enabled font awesome. menu social icons. That fixed the problem entirely. So it seems this plugin and the theme don’t play nicely.

    • This reply was modified 6 years, 9 months ago by 2kwarrior. Reason: Typo
    sensiblepeoplepodcast

    (@sensiblepeoplepodcast)

    Hi,

    our site is sensiblepeople.blubrry.net and our mobile menu is jacked up. It is splitting the tiles and putting them on different lines. For example, it looks like this

    Ho
    me

    Epi
    sod
    es

    Mee
    t
    the Hos
    ts

    Con
    tact
    Us

    Sho
    p

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Responsive Menu Image Too Large’ is closed to new replies.