Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #261772
    Edwin
    Participant

    Hello, regarding my website goldenbuddha.net I want to adjust the width of the sub-menus that drop from the main navigation menu. They are much too wide on desk top. Mobile is fine. Can you provide the css code? Also, please be careful that it does not disturb the padding and create a white space below the menu and above the header image. Thank you – Edwin

    #261773
    Edwin
    Participant

    I want to adjust it in the primary menu also, thank you. It is the same issue, the sub menus are much too wide.

    #261792
    Skandha
    Keymaster

    @mmhgloba: Hello there,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    /* To change width of sub menu of secondary menu */
    #secondary-menu ul.menu ul, #footer-menu ul.menu ul, #secondary-menu ul.menu ul a, #footer-menu ul.menu ul a  {
    	width: 100px;
    }
    /* To change width of sub menu of primary menu */
    #header-right .widget ul.menu ul {
    	width: 175px;
    }

    You can change the width according to your choice.
    Let me know if this works out!
    Kind Regards,
    Skandha

    #261798
    Edwin
    Participant

    Hi Skandha, thanks for the code, that worked great. But there is one more issue with the primary menu. The sub-menu hover creates a box and does not fill to the edge like with the secondary menu. Also, there is is a gap at the bottom. Can you assist? I would like the sub-menu to display in hover similar to the secondary menu. Thanks – Edwin

    #261878
    Skandha
    Keymaster

    @mmhgloba: Hello there,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    #header-right .widget ul.menu ul {
        padding: 0;
    }

    Let me know if this works out!
    Kind Regards,
    Skandha

    #261937
    Edwin
    Participant

    That worked great, thanks for the code. One more slight issue. In the secondary menu drop down on desk top, when clicked the window turns white. Can that be adjusted in css? This does not happen in the primary sub-menu. Thanks again.

    #262091
    Skandha
    Keymaster

    @mmhgloba: Hello there,
    Go to => Appearance => Customize => Additional CSS and remove the following CSS Code.

    #secondary-menu ul.menu ul a:focus {
    	background-color: #fff !important;
    }

    Let me know if this solves your issue!
    Kind Regards,
    Skandha

Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Sub menu width’ is closed to new replies.