title: How to accurately position divs with css
body: <p>I'm sure this is super simple, but I'm new to css. I'm essentially trying to position some rendered typography and make it stay centred no matter what the size of the browser is. I've tried using margins with percents, but that doesn't seem to work. </p>
  
  <p>Here's my code.</p>
  
  <p>html</p>
  
  <pre><code>&lt;div class="weare"&gt;
      &lt;img src="image/textrenders/weare.png" /&gt;
  &lt;/div&gt;
  &lt;div class="shaftesburytv"&gt;
      &lt;img src="image/textrenders/Shaftesburytv.png" /&gt;
  &lt;/div&gt;
  &lt;div class="awebbasedstudio"&gt;
      &lt;img src="image/textrenders/awebbasedstudio.png" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>.weare {}
  
  .shaftesburytv {}
  
  .awebbasedstudio {}
  </code></pre>
  
  <p>I want the result to look something <a href="https://drive.google.com/file/d/0BxW4C9zeoabxcnVsQWkyV3Jwc1E/edit?usp=sharing" rel="nofollow">like this</a></p>
  
  <p>Any help would be appreciated.</p>