title: CSS - Move border closer to text
body: <p>I have link that I want a border around but I can't get the border to appear closer to the text. Below is the css for the element;</p>
  
  <pre><code>.signup{
      border: 1px solid;
      border-radius: 10px;}
  </code></pre>
  
  <p>which displays the border as;</p>
  
  <p><img src="https://i.stack.imgur.com/JQ7R6.png" alt="image"></p>
  
  <p>If I add <code>height: 1.2em</code> it reduces the bottom spacing but not the top;</p>
  
  <p><img src="https://i.stack.imgur.com/DTcG1.png" alt="image 2"></p>
  
  <p>how do I reduce the spacing above the text?</p>
  
  <p>I'm using the bootstrap flatly theme <a href="http://bootswatch.com/flatly/" rel="nofollow noreferrer">http://bootswatch.com/flatly/</a> the element I want the border around is 'WrapBootstrap' in the top right of the navigation bar.</p>