title: How to add arrow to current page navigation link items?
body: <p>Like this. With IE6 compatibility too. </p>
  
  <p><img src="https://i.stack.imgur.com/OCARG.png" alt="enter image description here"></p>
  
  <pre><code>&lt;ul&gt;
  &lt;li&gt;&lt;a href="/home"&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li class="selected"&gt;&lt;a href="/about/"&gt;About&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="/contact-us/"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="/portfolio/"&gt;Portfolio&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="/gallery/"&gt;Gallery&lt;/a&gt;&lt;/li&gt;
  &lt;ul&gt;​
  </code></pre>
  
  <p>You can use this jsfiddle example to play with</p>
  
  <p><a href="http://jsfiddle.net/jitendravyas/GN6ed/" rel="nofollow noreferrer">http://jsfiddle.net/jitendravyas/GN6ed/</a></p>
  
  <p>and this arrow image <a href="https://i.imgur.com/QHFqq.gif" rel="nofollow noreferrer">http://i.imgur.com/QHFqq.gif</a></p>