Was wondering if you guys could help us with our submenu in our header. Right now each link is in a box that is set to the size of the title itself and the submenu only takes up about 60% the bar; instead what we’d like to do is have the boxes be a standard, equal size so that the 6 links take up that whole bar.
Hi XTGlobal!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
div#header_main_alternate .container { width: 100%; margin: 0; }
@media only screen and (min-width: 1140px) {
.av-main-nav > li > a { padding: 0 51.6px; }}
@media only screen and (max-width: 1139px) and (min-width: 1010px) {
.av-main-nav > li > a { padding: 0 51.6px; }}
@media only screen and (max-width: 990px) {
.av-main-nav > li > a { padding: 0 22.6px; }}
Regards,
Yigit
Ok, it’s been awhile, but now we’ve added an item so now it needs to be 7 equally spaced menu items and I can’t seem to get this right:
div#header_main_alternate .container { width: 100%; margin: 0; }
@media only screen and (min-width: 1140px) {
.av-main-nav > li > a { padding: 0 20px; }}
@media only screen and (max-width: 1139px) and (min-width: 1010px) {
.av-main-nav > li > a { padding: 0 20px; }}
@media only screen and (max-width: 990px) {
.av-main-nav > li > a { padding: 0 0px; }}
This is as close as I’ve been able to get it, but the margins in the navigation area are still there. Help?
Hi!
Please add following code to Quick CSS as well
div#header_main_alternate .container {
padding: 0;
}
Best regards,
Yigit
Oh awesome that and some adjusted math and it’s perfect. Thanks!