Переход на соседний элемент
 

Есть кнопка при наведении на которую сразу под ней всплывает элемент (mouseover). Ну и сокрытие элемента при сведении курсора с кнопки и с самого элемента на mouseleave. Но как учитывать переход на с кнопки на всплывающий элемент?

<style>
  button {
    position: relative;
  }

  span {
    position: absolute;
    display: none;
  }

  button:hover span {
    display: block
  }
</style>
<div>
  <button>ok<span>op</span></button>
</div>

можно придумать несколько разных способов...

<style>
  button {
    position: relative;
  }
  span {
    position: absolute;
    display: none;
  }

  button:hover ~ span, span:hover {
    display: block
  }
</style>
<div>
  <button>ok</button><span>opdf</span>
</div>

если элемент соседний