title: Place before content outside the anchor tag using CSS
body: <p>I have used <code>:before</code> and added some content using CSS <code>content</code> property before anchor tags.
  I want to place this content above the anchor tags but facing some issues in positioning when padding is applied on anchor tags. Please check the jsbin demo to make things clear.</p>
  <h2><a href="http://jsbin.com/ebafec/6/edit" rel="nofollow noreferrer">Check at JSBIN</a></h2>
  <p>Here is my CSS code</p>
  <pre><code>ul {
    margin-top:200px;
    list-style-type: none;
  }
  
  li {
    height: 100px;
  }
  
  a {
    outline: 4px solid skyblue;
  }
  
  a:before {
    content: &quot;top place&quot;;
    background-color: blue;
    color: white;
    padding: 5px;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    font-size: 14px;
    
    /* To move it to top of anchor element*/
    position: absolute;
    margin-top: -30px;
    margin-left: -4px;
  }
  
  .b {
    padding: 40px;
  }
  </code></pre>