Line-height does not change your previous advices

Hi

I have been in touch with this issue before and and the question is line-height doesn't change in desktop view or mobile or tablet. I use Header Builder in menu. The site is development environment but you should see it https://sely-fi.hel7.wp-cloud.dev/

Kind regards Sari



Comments

  • Hey,

    Please send us WordPress dashboard access privately thru the contact form, which is on the right side at http://themeforest.net/user/muffingroup#contact, and we will check what might be the reason.

    Notice!

    Please attach a link to this forum discussion.

    Thanks

  • Please, try the following code instead:

    @media only screen and (min-width: 960px){
       .mhb-menu .menu li a span{
          line-height: 40px!important;
       }
    }
    @media only screen and (max-width: 959px) and (min-width: 768px){
     html .mhb-menu .tabletMobile .menu li a span{
       line-height: 50px!important;
     }
    }
    @media only screen and (max-width: 767px){
       html .mhb-menu .menu li a span{
          line-height: 60px!important;
       }
    }
    

    Thanks

  • HI

    did not work, the height of the line increased even more.


    Sari

  • But you can decrease it by putting a lower pixels value. For example, instead of 50px, use 20px or whatever suits you.

    You can also describe to me what exactly you want to achieve and how it is supposed to look.


    Thanks

  • Hi

    okey I got the desktop and tablet view fixed but there is still a problem with the mobile view.

    Mobile mainmenu and submenu font-size should be the same size now the font size is different ,

    now the submenu font-size is too big.

    Below screenshot

    sari


  • For the font size and line height use this code:

    @media only screen and (max-width: 767px){
        .menu .menu-item .sub-menu span{
            font-size: 13px!important;
        line-height: 30px!important;
        }
    }
    

    Line height will also move the plus icon.


    Thanks

  • Hi

    sorry, but submenu -> and its sub-menu line-heights in mobile view still look bad.

    If text-size is 14px so line-height should be about 16px but now it still seems much biger.

    and the the plus icon is not in the row.

    Kind regards Sari


  • Unfortunately, there is nothing else much I can do with this line-height. As a workaround, you can decrease this font size so the text will not be in two lines but one.

    For the plus and minus icons, try the following code:

    .mhb-menu .menu li .menu-toggle{
       line-height: inherit!important;
    }
    

    Thanks

  • Hi

    nothing chanced and if I change font-size no-one can read the menu text. But is it posuble get much more wider the menu area

    (then I have a possibility get some where submenu text one line) and also if I get line below submenu text then it would be easy to read submenu.

    Thanks


  • Please, try the following code:

    @media screen and (max-width:767px){
       .mhb-menu .menu li ul li{
       width: 100%!important;
       border-bottom: 1px #bbb solid!important;
     }
       .mhb-menu .menu{
          width: 250px!important;
       }
    }
    

    Thanks

  • Hi

    great now I got mobile view looks much better (I increased width 280px and so I got to the same line text)

    Thanks

Sign In or Register to comment.