title: Trying to move a button further down the page
body: <p>I am fairly new to web development so I apologize if this is a "newbie" question, I've looked on various sites and tried various things but am not able to move a button on my page to where I want it to go.</p>
  
  <p>Here's the code I have for it in HTML:</p>
  
  <pre><code> &lt;div class="crown"&gt;
          &lt;div class="container"&gt;
            &lt;img src="http://www.clker.com/cliparts/3/8/d/6/12205466202120645650portablejim_Chess_tile_-_King_1.svg.med.png" height="250" width="200"&gt;
               &lt;h3&gt;&lt;strong&gt;Join today!&lt;/strong&gt;&lt;/h3&gt;
                &lt;p style="text-align: center;"&gt;&lt;a class="btn-two" href="#"&gt;Register&lt;/a&gt;&lt;/p&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  
  
      &lt;section class="footer"&gt;
        &lt;div class="container"&gt;
            &lt;p&gt;&amp;copy; 2016&lt;/p&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  
      &lt;/body&gt;
    &lt;/html&gt;
  </code></pre>
  
  <p>And here's the CSS for it:</p>
  
  <pre><code>.btn-two {
  border: 1px solid black;
  padding: 20px;
  text-decoration: none;
  background-color: black;
  color: white;
  text-align: center;
  margin: 20px 0 -30px 0;}
  </code></pre>
  
  <p>I've tried a lot of things in the CSS that aren't working. I want the button to be a few inches below the "Join today!" text but it stays where it's at, like a hair below the text when I want there to be space in between the text and the button. Any idea what I'm doing wrong? And again I'm new to all this so I appreciate your understanding. Thank you.</p>