Weird header appareance in width 1024px

Hi there,

You can choose when to initiate the mobile menu with this code: https://gist.github.com/generatepress/c23aef2d05807c39bb32

Simply change the 768px to your necessary width, and you should be good to go.

Let me know :)

Great!

I only see that from the width I write, to 768px, the logo keeps aligned left, and the mobile menu centered, what looks strange. I add this code to your code to fix this issue:

.fluid-header .inside-header {
    text-align: center;
}

If you consider my code does not have side effects, the topic is resolved.

Thank you!!

Looks good to me!

You're welcome :)

I have found some side effect of this change, this is because I changed this issue as still not resolved.

If I install the secondary navigation addon and I configure it as navigation layout “Fluid/full width”, “float right” navigation position and “right” navigation allignment, the next thing happens:

- From 768px till the width configured in the code you gave me, the secondary menu shows their items, even when the toggle is not pressed. Some modification to fix it?

Thank you.

Hi there,

Answered this for you here: https://generatepress.com/forums/topic/secondary-navigation-items-position/#post-167189

No, it is not the same solution. If you see this topic, you gave me a code (https://gist.github.com/generatepress/c23aef2d05807c39bb32) to get appear the toggle menu for a specified width. But with the secondary menu the problem with that code is that the elements are showed even when the toggle is not pressed.

In my web, the problem is showed between 768 to 850px. You can check narrowing the window in my web, or you can see a screen shot of the problem: http://econactiva.es.mialias.net/wp-content/uploads/2016/01/screen-shot-secondary-menu-problem.png

I hope the issue is more clear. Thank you in advance.

http://econactiva.es.mialias.net/
user: econac289
pass: q7lLHdjD

Ah I see, here you go:

@media (max-width: 850px) {
    .secondary-navigation ul {
        display: none;
    }
    .secondary-navigation.toggled ul.secondary-menu {
        display: block;
    }
}

But with that code, I dont see the elements of the secondary menu when I press the toggle! I want to see them only when I press the toggle, as it happens from 768px and down.

Thanks in advance.

Try the edited code above :)

Thats it! Great Tom, thanks a lot.

You're welcome :)