title: How do I animate this box to have a pop out effect?
body: <p>I have a simple div set up and I was wondering how I could make it have a 'pop out' effect. For example, I would like it to start as a smaller rectangle and have it animate to a slightly larger rectangle giving it the illusion that it is popping out at you.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="submit-logged-out"&gt;
      You must be &lt;a href="/wp-login.php?action=register"&gt;registered&lt;/a&gt; to submit.
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>#submit-logged-out {
  background: #000;
  color: #fff;
  font-size: 2em;
  left: 112px;
  padding: 40px;
  position: absolute;
  top: 200px;
  }
  </code></pre>
  
  <p>JSFiddle: <a href="http://jsfiddle.net/SSsVx/" rel="noreferrer">http://jsfiddle.net/SSsVx/</a></p>