Center menu – responsive ?!

i do not see a link to the concerning site so in this point i can not help you in detail.

But what behavior should a menu have if the space from left to right is not enough?
To have the menu responsive there are two main solutions.
The one is that some listpoints are floating underneath the others – the other one is to shrink font-size, margins or paddings between list points.

Edit: try first the other solution – seems to be clearer !

so one possibility is to have a fluent nav height.
if you don’t want to shrink font-size you have to allow floating (as you does) – but your container with navigation is set to 50px height.
try this here instead:

#header .container {
     max-width: 100%;
     padding: 0px;
}

#header_main_alternate {
     border: medium none ! important;
}

.html_header_top.html_header_sticky.html_large.html_bottom_nav_header #main {
    padding-top: 138px !important;
}

.html_header_top.html_logo_center .logo {
     filter: drop-shadow(2px 2px 3px #888888);
     left: 50%;
     transform: translate(-50%, 10px);
}

.html_header_top.html_logo_center .main_menu ul:first-child {
     display: inline-table ! important;
     width: auto ! important;
}

.html_header_top.html_bottom_nav_header .main_menu > div, .html_header_top.html_bottom_nav_header .main_menu ul:first-child {
     height: auto ! important;
     width: 100%;
}

@media only screen and (max-width: 1120px) {
.html_header_top.html_header_sticky.html_large.html_bottom_nav_header #main {
    padding-top: 186px !important;
}
}

on transformation the logo for me it looks nice to have the logo a bit shifted down. But it is a matter of opinion.
the padding-top is for having the slider not covered by the navigation.

• This reply was modified 7 years, 3 months ago by Guenni007.

i see that this code was inserted after my last information:
it is in media-querie und 810px – can you please remove it shortly
i thought you like to have for body (#top.boxed) max-width: 1010px and width: 85%

.container {
    width: 100%;
}
.container .av-content-small.units {
    width: 80%;
}
.responsive #top.boxed, .responsive.html_boxed.html_header_sticky #header, .responsive.html_boxed.html_header_transparency #header {
    max-width: 90%;
    width: 80%;
}
.responsive .container {
    max-width: 80%;
}
#top #header .av-main-nav > li > a {
    font-size: 15px;
}

after that we will see what happens

you lost something (the max-width of body):

#top.boxed, .html_boxed.html_header_sticky #header {
    max-width: 85%;
    width: 1010px;
}

the rules above are conflicting and confusing that rule

is my english too bad or do you like to misunderstand me –
this is the code you should add: https://kriesi.at/support/topic/center-menu-responsive/#post-743775

and this is the code you have to remove – https://kriesi.at/support/topic/center-menu-responsive/#post-745323
because it is not the code you need. If you have removed it i will see what code will do the job

you can do that or you can wait till mods are here in this thread.

ok – have a look and see if i understood your request in the right way.

btw: i added some code to your functions.php of your child theme –
this is why your quick css input window is now at 100% width and responsive

By the way – please do update to WP 4.72 soon -because there are a lot of sites hacked (hacked by sa3d hack3d) including two of my sites.
it is a security problem of WP 4.71 only and goes to posts (not pages nor portfolio posts) see google

• This reply was modified 7 years, 2 months ago by Guenni007.

this is because it is in media querie rule:

the ending curly bracket is now missing there – where do you want to end this rule. You have to put in a }

Edit : i put in the bracket – now you can erase me as user

that is the reason why i do not have those media queries in the middle of the css. i put it alway on the bottom to it:

@media only screen and (max-width: 810px) {
this last closing bracket was not there
}