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

  • 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: (visible only to logged in users)

  • siobhyb · Member ·

    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.

  • 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

  • siobhyb · Member ·

    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.