I am trying to create a menu similar to http://www.boaelite.com/. Where the menu is on the left and right of the centered logo.
Right now, I have a main menu that I’m trying to bring above the logo and to the left. Then I have a sub menu to the right. The problem is that the container for the logo is at 210 px (my logo size). How do I get rid of that space.
Or is there a better way to go about this? (Of course, I want this to work on mobile too)
Here is my Quick CSS:
nav.main_menu {
top: 2px;
left: -25%;
}
.inner-container {
top: 210px;
}
Sorry for the multiple posts. But I did get this a little further. BUT when I move down I lose the main menu. Is there any way to get the menu to remain viewable or sticky?
Here is where I’m at on CSS:
nav.main_menu {
left: -39%;
top: -215px;
}
.inner-container {
top: 210px;
}
/* Centers logo and leaves it bigger size*/
.html_header_top.html_logo_center .logo {
left: 28%;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
#header_main>.container {
padding: 0;
top: -215px;
}
Hi!
I think what your trying to do is something like this.
nav.main_menu {
left: -35% !important;
position: fixed !important;
top: 20px !important;
}
Best regards,
Elliott
Great!!!
nav.main_menu {
left: -35% !important;
position: fixed !important;
top: 55px !important;
}
…worked perfectly. Thanks Elliott! Appreciate your help.
Lynn