Site logo

Archived topic

Overlay alignment

7 replies · Started by Gerrit on July 20, 2022

Viewing posts 1–8 of 8

Hi, how do I change the alignment Of the off canvas overlay?

Hi Gerrit,

Not sure what you meant by changing the alignment.

Can you explain a bit more?

A link to your site and an example would be very helpful.

I would like the off canvas menu to align left instead of center. It is only visible on mobile though.

Thank you

Try add this CSS:

#generate-slideout-menu .inside-navigation.grid-container.grid-parent {
    text-align: left;
    align-items: flex-start;
}

#generate-slideout-menu.do-overlay .slideout-menu li {
    text-align: left;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Perfect, is it possible to align only the close button to the right as well?

Try this CSS:

@media (max-width: 768px) {
    .slideout-navigation.do-overlay .inside-navigation .slideout-exit {
        margin-left: auto;
    }
}

Awesome, thank you😊

No problem :)

This archived topic is closed to new replies.