Archived topic
Centering close "X" on off canvas overlay for PC
5 replies · Started by Gregg on August 16, 2022
Hi - been using your theme for years for myself and others - love it!
I am trying to center the close button ("X") on the off canvass overlay menu (not mobile - on PC view). There is code that centers it when on a mobile screen, but when I shrink the browser screen on my PC it still shows on the right side.
If I keep shrinking the browser width it eventually flips into mobile mode and the "X" centers itself.
Tried searching and messing around but couldn't figure it out.
Here is the code to center on mobile that came with the theme template I installed.
@media (max-width: 768px) {
.slideout-navigation.do-overlay .slideout-exit {
text-align: center;
}
}
Not sure if I am supposed to put my url in here or not - so I put it in private info area.
Thanks in advance for your help.
Hi Gregg,
There seems to be no Off canvas menu on desktop from my end. There’s only one in mobile and tablet.
Can you try clearing cache?
When you have the page open, manually shrink the browser screen and the off canvas menu will display when you go below 850 px in width. Said another way, the off canvas menu is not there all the time - only when it hits a certain width.
Apologies if I am not using the correct terminology.
I see. Try adding this CSS in Additional CSS:
@media (min-width: 769px) {
.slideout-navigation.do-overlay.is-open .slideout-exit {
position:static;
}
}Hey that's great - worked perfectly.
Thanks.
You’re welcome Gregg!
