title: CSS menu transitions not working
body: <p>I'm trying to add some transition effects onto my css dropdown menu, but wherever I put the transition code in it doesn't seem to work.</p>
  
  <pre><code>transition: all 2s ease-in;
  </code></pre>
  
  <p>I'm trying to get the transition to fade in and out on hover of the parent li of the actual dropdown ul so that the event doesn't happen so suddenly.</p>
  
  <p>jsfiddle: <a href="http://jsfiddle.net/JazParkyn/6jshy/5/" rel="nofollow">http://jsfiddle.net/JazParkyn/6jshy/5/</a></p>