Header Behavior > Let logo and menu position adapt to browser window - Support

Viewing 12 posts - 1 through 12 (of 12 total)

Author

Posts
November 20, 2019 at 6:48 pm #1158570

elituchy
Participant

This doesn’t seem to be working for our site.

http://www.allstatesprinkler.com

November 21, 2019 at 12:58 am #1158654
Jordan Shannon
Inactive Moderator
Hey elituchy,

You can try switching to mobile menu sooner to avoid that odd break:
```
@media only screen and (max-width: 1024px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}
```
Best regards,
Jordan Shannon
November 21, 2019 at 1:08 am #1158658

elituchy
Participant

Jordan, thanks for the suggestion and we may use it, but I don’t think this addresses my question.

We still need to know how to change the settings do menu bar is full width. Right now the size is restricted.

November 21, 2019 at 2:36 am #1158678

Jordan Shannon
Inactive Moderator

Hi,

I’m not understanding. Can you screenshot the issue and paste it here?

Best regards,
Jordan Shannon

November 22, 2019 at 12:57 am #1158956

elituchy
Participant

See http://www.clipular.com/c/4613139356975104.png?k=sjLZ3TgfQVmEh9RkKH9j7hVGeUI
Note how all the menu links do not show the full width of the screen.

November 22, 2019 at 12:59 am #1158957

elituchy
Participant

The setting… http://www.clipular.com/posts/5893114269794304?k=DhHjIHduNIyFhBPVjtWTHdxE0Bs

November 22, 2019 at 6:16 pm #1159260

Victoria
Inactive Moderator

Hi elituchy,

https://cl.ly/f9c7f8f5a325 Do you mean you want something like this?

The setting above does not make the menu full-width.

Best regards,
Victoria

November 22, 2019 at 6:21 pm #1159265

elituchy
Participant

That’s better than what we currently have. How do we do that?

November 23, 2019 at 4:41 pm #1159460
Victoria
Inactive Moderator
Hi elituchy,

Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
```
@media only screen and (min-width:1100px){
    .av-main-nav li {
        width: 8vw;
    }
    .html_header_top.html_logo_center #header_main_alternate .main_menu ul:first-child {
        width: 90vw;
    }
    #menu-item-1426,
    #menu-item-1429,
    #menu-item-2718 {
         width: 17vw;
    }
  #menu-item-2725 {
        width: 22vw;
  }
}
```
If you need further assistance please let us know.

Best regards,
Victoria
November 23, 2019 at 6:59 pm #1159493

elituchy
Participant

@victoria that works but it has issues. See http://allstatespdev.wpengine.com/ (hosted on WPengine)

The indicator below the button is not in the correct position.

November 25, 2019 at 4:58 pm #1159917

elituchy
Participant

@victoria @jordan Please help

November 26, 2019 at 3:51 pm #1160369

Yigit
Keymaster

Hi,

I replied to your thread here – https://kriesi.at/support/topic/header-behavior-let-logo-a/. Let us continue there :)

Best regards,
Yigit
Author

Posts

Viewing 12 posts - 1 through 12 (of 12 total)

The topic ‘Header Behavior > Let logo and menu position adapt to browser window’ is closed to new replies.