title: Detecting clicks in margin space of <li> elements
body: <blockquote>
    <p>Is there a way to detect clicks on the css margin of an element?</p>
  </blockquote>
  
  <p>I'm working with a tagging system in a textbox a bit like <a href="http://loopj.com/jquery-tokeninput/demo.html#theme" rel="nofollow">this one</a>. What I want to be able to do, is register when a user clicks between two tags, and position the cursor as such. This space is created by a margin on the tags - is there a way I can detect a click in that zone?</p>
  
  <p>The space is otherwise just part of the ul element, where of course, I could detect a click, but couldn't tell where it was (could I?) so wouldn't know where to position the cursor. The only solution I can think of is to create two 3px wide empty span's to use in place of the margins, and register clicks on them instead...but obviously that's not such a neat solution. Is there a better way to do this?</p>
  
  <p>Here is a jsfiddle: <a href="http://jsfiddle.net/78rhB/1/" rel="nofollow">http://jsfiddle.net/78rhB/1/</a>
  The bit of CSS I'm looking at detecting is:</p>
  
  <pre><code>    li.token-input-token-facebook {
          margin: 3px;
  }
  </code></pre>