A Pen by jupegarnica.

<h1>Direction aware hover pure CSS</h1>

​

  <div class="box">

    <div class="box__right">Right → Left</div>

    <div class="box__left">Left → Right</div>

    <div class="box__top">Top → Bottom</div>

    <div class="box__bottom">Bottom → Top</div>

    <div class="box__center">

      Hover from any side  

    </div>

  </div>

​

<footer>Created by <a href="https://twitter.com/FWeinb" target="_blank">Fabrice Weinberg</a><br> Read about it on my <a href="https://blog.weinberg.me/2013/06/21/direction-aware-hover-pure-css/">Blog</a></footer>