In the WordPress Kleo theme, the submenu can appear to too far from the main menu links if the header is big.

Typically the submenu is at a good height when a page using the Kleo Theme is in a scrolled state because the header reduces in size. But it can look too far away if the header is unscrolled and big.

To fix this, place the following code in your theme’s style sheet. Hopefully you are using a child theme. If not, your style sheet code could be overwritten with theme updates.

.navbar-nav>li>.dropdown-menu {
margin-top: -36px
}

.header-scrolled .navbar-nav>li>.dropdown-menu {
margin-top: 0 !important;
}

You can tweak the pixel values to suit.