Changing menus so they drop down to the right instead of left.

  • Author
    Posts
  • #2653214

    donnezac
    Member

    Hi all,
    Am using the TwentySixteen theme which I love. However, the menus drop down to the left, and the sub-menus – which means the first two rubrics fall off the screen to the left and can’t be read. Is there any way I can change it so that they drop down to the right? I asked WordPress help and they said it would have to be done in CSS and to ask you lovely people. I will take the time to teach myself a little CSS but for the moment I need a quick fix as the website is about to go live!
    Huge thanks if you can help :)

    The blog I need help with is donnezac.com.

    #2653332

    siobhyb
    Staff

    Hi there,

    You can change the positioning of those arrows and submenus using the following custom CSS:

    @media screen and (min-width: 56.875em) {
    .main-navigation ul ul li:hover>ul, .main-navigation ul ul li.focus>ul {
        right: auto;
        left: 100%;
    }
    
    .main-navigation ul ul .menu-item-has-children>a:after {
        -webkit-transform: rotate(270deg);
        -moz-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        transform: rotate(270deg);
    }
    }

    Let me know how you get on with that or if you have any extra questions.

    #2653361

    donnezac
    Member

    Hi there, Sorry for the delay in my reply – thank you soo much!! It worked, it stuck and it made me realise why something else i was trying to do wasn't working (reducing the padding, have sorted it now). Thanks again, brilliant support.

    Samantha

    #2653365

    siobhyb
    Staff

    You’re welcome, Samantha! :) We’re right here if anything extra comes up too.

The topic ‘Changing menus so they drop down to the right instead of left.’ is closed to new replies.