Archived topic
Slideout menu width
5 replies · Started by Bernhard on December 7, 2020
Hello,
I need to add some px to the slideout menu width to show the menu item "informazione turistica" on one row. How can I make this?
Thank you
Hi there,
try adding this CSS:
body .offside--left.is-open, body .offside-js--is-left .offside-sliding-element {
-webkit-transform: translate3d(300px,0,0);
-moz-transform: translate3d(300px,0,0);
-ms-transform: translate3d(300px,0,0);
-o-transform: translate3d(300px,0,0);
transform: translate3d(300px,0,0);
}
body .main-navigation.offside {
width: 300px;
}
body .offside--left {
left: -300px;
}
Very good, thank you. Just one thing:
I added margin-top: 90px; in the second line of your CSS to avoid that the slideout menu covers the 2ary navigation and the logo on mobile.
But when the menu closes, it seems now to slide in to the top left. When closing, I see for some milliseconds part of the menu in the upper left corner.
Use this CSS to add the 90px top margin:
body .offside--left {
margin-top: 90px;
}
This will apply to the open and closed slideout.
Great, thank you :)
You're welcome