Tagged: center menu
Hi,
I’m using a full width layout and the client wants to have the logo on the left, a widget on the right (which I can do) but then the menu centered in line with the layout container. So that the menu items are spaced equally and line up with the left and right hand sides of the content.
Is this possible? I’ve tried all sorts of things but have had no luck so far.
The site is at: http://lander.digitalessence.net/
Many thanks as always.
Hedley
Hey DigitalEssence,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
@media only screen and (max-width: 1300px) {
#top .av_seperator_big_border#header .av-main-nav > li > a {
padding: 0 70px;
}}
.html_header_top.html_logo_center .logo {
left: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
then remove following code you added
.logo {
float: left;
padding-left: 20%!important;
}
Best regards,
Yigit
Thanks Yigit,
I was originally using the Logo Left, Menu below option to get the logo and widget to display ranged fully left and right but have since moved to the logo centered, menu below. Is it possible to have the logo fully at the left of the browser window and likewise, the widget fully right? We really don’t like it but the client wants it this way.
Thanks,
Hedley
Hi,
Please add following code to Quick CSS as well
.container.av-logo-container {
max-width: 100%;
padding: 0;
}
then find following code in your custom CSS
@media only screen and (max-width: 2500px) {
#header_main .widget {
position: absolute;
right: 0;
top: 0px;
padding-right: 15%;
}}
and change 15% to 0
Best regards,
Yigit