title: Hover effect in navigation menu (wordpress)
body: <p>I´m creating web page in wordpress, and I have navigation menu using
  <code>&lt;?php wp_nav_menu(); ?&gt;</code> .. The problem is, I want to create hover effect, displayed in enclosed image. 
  <a href="http://s11.postimage.org/gclhor5hv/try.jpg" rel="nofollow">http://s11.postimage.org/gclhor5hv/try.jpg</a></p>
  
  <p>The problem is, I don´t know how to create that triangle on the bottom of the hovered list item. 
  Here´s the CSS:<br>
  <code>#navHead li a:hover{<br>
   background-color: #e00d1d;<br>
   border-radius: 5px;<br>
   color: #fff!important;<br>
   background-repeat: no-repeat;<br>
   background-position: 50% 30px;<br>
  }</code></p>
  
  <p>In HTML: navigation list is generated, so I can´t reach and edit structure, so it has to be done in CSS.</p>
  
  <p>Thanks for your help.</p>