Archived topic
Slideout-menu Button
5 replies · Started by Rostyslav on February 25, 2021
Hello,
How can I create a slideout-menu button like this?: https://ibb.co/Vx4cfN0 in that position. I tried to make an Element>Block then I made a button (generate_after_slideout_navigation). But I don´t know how to make a button wider, to center it and move it higher in slideout_navigation.
Thank you!
Hi there,
Any chance you can link us to the site in question?
You can use the private information field.
Let me know :)
Yes, sure.
Hi there,
You seem to have widgets added to the Off-Canvas Panel on Appearance > Widgets that prevents the button from being aligned and extended properly as shown here:
You can remove them so they don't interfere with the button layout.
As for centering the button, add this CSS:
.gb-container.gb-container-db105e4d {
margin: 0 auto;
}As for making it wider:
Go to the Block Element that adds the button and increase the Button's left and right padding so it looks wider.
As for making the button closer to the menu items:
Go to the Block Element that adds the button and remove the top padding of the Container Block.
If that isn't close enough for your preference, add this CSS to remove the margin-bottom of the navigation.
.slideout-navigation .main-nav {
margin-bottom: 0;
}Thank Elvin you are a Genius!
No problem. Glad you got it sorted. :D
