Display of menu - taking up too much vertical space

Thanks for helping me with the top section of my website

Now for a couple more problems - website is www.essexvoicespast.com

At the moment, if my window zoom on my desktop is set to more then 90% (eg 100%), then my logo on the top left and my menu is split over two areas and takes up way too much vertical room.

So - is it possible that if the combination of the logo/menu takes up too much vertical height, then the menu is removed totally - leaving just the logo on the left and a drop-down menu on the right (ie the same layout as it is on an iPhone).  

Doing this will reduce the vertical space used for this area.

thanks for your help

Comments

  • Hello
    Thanks for contacting to us.
    Add the below css code inside the custom css box. 

    @media only screen and (min-width: 767px) and (max-width: 1024px) {
    .navbar-default .navbar-nav > li > a {
        font-size: 11px;
        padding: 38px 10px;   
    }
    }

    Let me know for further assistance. 

    Thanks
    Akhilesh
  • Sorry - it don't work.  I've put the code in but it's the same problem
  • edited March 26
    It worked when I zoomed to 125%.  But no change at 100%
  • edited March 27
    Hello
    Delete the previous css code and add the below css code inside the custom css box 

    @media only screen and (max-width: 1024px) and (min-width: 600px)
    {

    .navbar-default .navbar-nav > li > a 
    {
        font-size: 11px ! important;
        padding-left: 10px ! important;
        padding-right: 10px ! important;
    }

    }

    Let me know for further assistance. 

    Thanks
    Akhilesh
  • Thanks for your help.  100% is still not working properly but I suppose it must be my laptop as all other zooms are working
  • edited March 29
    Hello
    Delete the previous css code and add the below css code inside the custom css box 

    @media only screen and (max-width: 1200px) and (min-width: 600px) {
    .navbar-default .navbar-nav > li > a {
        font-size: 11px ! important;
        padding-left: 10px ! important;
        padding-right: 10px ! important;
    }


    Let me know for further assistance. 

    Thanks
    Akhilesh
  • Brilliant - that's totally fixed it now.

    Thanks for your help.
  • HI
    Glade to know that its work for you . 
    If you  like our theme and support pls give rate us here .

    Look forward see  you again at webriti
    Thanks 
    AKhilesh
This discussion has been closed.