CSS Space between menu and submenu

You could make use of :before to extend the "hoverable" area:

nav ul ul:before {
    content: "";
    display: block;
    height: 20px;
    position: absolute;
    top: -20px;
    width: 100%;
}

See this demo.