Site logo

Archived topic

Slideout Navigation,. GeneratePress Premium Version: 2.3

38 replies · Started by Nils on June 19, 2019

Viewing posts 1–15 of 39

Hello again,
I have a curiosity with the website navigation.
Depending on the zoom level, some menu items are not displayed correctly and sometimes even covered :(

Screencast

The behavior is difficult to describe but can be found at https://biologika-register.de.

In addition, the drop-down arrow in the menu is often not displayed, or only displayed truncated.
drop-down

Any ides?

Greetings from the brooding warm Berlin :-)

Hi there,

i am not able to replicate that issue on any browser on Mac OSX. Do you notice the issue on a different browser? Do you have any extensions on the browser that may effect it?

Hi David,
I have only 2. Windows PCs available but Windows 7 & 10 with Chrome, Firefox and Internet Explorer show the same behavior.

The problem seems to arise during scaling or zooming (110% and above).
If you expand the menu item "Was ist Rabbit", then set a zoomlevel of 110% and scroll down or up, you would have to get the same result.
For the purpose of testing, I had disabled all browser plugins and tried it on my notebook, unfortunately, no change.

Maybe Safari does it better, I'll test it right away.
Nevertheless it has to work with the other browsers too ..

Like last time;
Unfortunately, my English is still not much better than the last time, so it is difficult for me to describe the problem :-(

Thank you for your time!

I could set up a Hyper-V installation for you and give you TeamViewer logins, maybe that would be easier?

Definitely something strange going on with the arrows there. Can you temporarily remove any navigation-related custom CSS you've added to see if something is conflicting?

Done, you can find the page now under http://in-it-services.de/web
Unfortunately, the problem still exists without my adjustments.
The website I started last year with WP 4.9.x and now only after some time, so there were a lot of updates. Maybe a mistake has crept in here

I thought the issue was the arrows were missing/half cut off?

If so, that doesn't seem to be an issue without the custom CSS: https://www.screencast.com/t/HAdvOZsZq3

If we can confirm that, we know what we're looking for.

The arrows are now displayed correctly. I will test tonight where the problem is. I think that has to do with the indented submenus.

The bigger problem is the lower menu items are be covered when;
1. I click on the arrow next to "What is RABBIT" to open the submenu.
2. Set a zoom of 110% or resize the window
3. and now scroll down/up.

I tried to show that on the first post with the picture but it was not that great ..

What if you add this CSS?:

#sticky-placeholder {
    opacity: 0;
}

no change to see

Where did you add the CSS? I'm not seeing it on your site.

You are on
https://in-it-services.de/web/
?

In the source text, line 503 - 505.

I have tested the arrows and somewhere must be a mistake here.
Here is a screencast without custom css;
arrows

Unfortunately, depending on the zoom or window movement, the arrows are not always displayed correctly

So that's happening because there's no space for the arrows, so they drop down.

You can try preventing this with this CSS:

.sidebar .menu-item-has-children .dropdown-menu-toggle {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
}

.sidebar #primary-menu ul li.menu-item-has-children>a {
    padding-right: 30px !important;
}

.sidebar .main-navigation .main-nav ul li a {
    line-height: normal;
    padding-top: 10px;
    padding-bottom: 10px;
}
This archived topic is closed to new replies.