On regular pages, the dropdown feature functions flawlessly.
However, when using Vue-router in a single-page application (SPA), the dropdown menu seems to vanish between the navbar-item and its child navbar-link unless the cursor is moved quickly from one to the other.
There appear to be no gaps or margins in the HTML code on the router page or between the router view and the navbar. The transition from the navbar-item to the dropdown menu is smooth on standard web pages, but on the router page, the dropdown disappears as soon as the cursor leaves the inner tag enclosed within the outer div.
// outer tag
<div class="navbar-item has-dropdown is-hoverable">
// inner tag
<a class="navbar-link">More:</a>
</div>
Applying a style="height: 100%" does not resolve the issue of making the a tag fit completely inside the outer div.