LayersWP – How can i make the Menu icon on mobile bigger?

Asked on September 22, 2015 in How To.

Hey Guys ,

i was wondering if you can make the menu icon bigger (see image)
i want it a bit larger so it is good in comparison to my Logo.

Kind regards

Dieter Jeanty Layers User
  • Possible Answers to Your Question:

  • 1 Answer(s)
    Answered on September 22, 2015.

    Hi there,

    The menu icon is a font, so can be made bigger just like increasing the font size of a text element. Example:

    .responsive-nav .l-menu{font-size: 2.8rem;}

    Thanks , that worked good for me
    now the only question more i have is there a css code to get
    the menu button lower so the height is the same as the middle of the logo?

    many thanks !

    on September 23, 2015.

    Hi there,

    You can do that by increasing the negative margin. If you look at the CSS code in the browser inspector, you will see this when selcting the responsive-nav element:

    .responsive-nav, .header-sticky.is_stuck.is_stuck_show .responsive-nav {
    float: none;
    position: absolute;
    right: 0;
    top: -35px;
    padding: 0;

    Change the top value up or down to change the position of the icon. If you want to give it space on the right, you can also change the right value.

    .responsive-nav, .header-sticky.is_stuck.is_stuck_show .responsive-nav{
    top: -45px;
    right: 10px;

    Please see the following for tips on how to use the Browser inspector with DevKit:

    on September 25, 2015.

    Great , it worked perfectly thanks for all the info!

    on September 25, 2015.