title: Align text to center with image on the same line
body: <p>I'm trying to center text that got an image in the same line, and it centers the text with the rest of the line, but not to the center of the browser.</p>
  
  <p>Here's the JSFiddle - <a href="http://jsfiddle.net/Hdn9w/1/" rel="nofollow">http://jsfiddle.net/Hdn9w/1/</a></p>
  
  <p>I know i can change:</p>
  
  <pre><code>.text1
  {
      line-height: 450%;
      font-size: 30px;
      font-family: David;
      text-align: center;
  }
  </code></pre>
  
  <p>to:</p>
  
  <pre><code>.text1
  {
      line-height: 450%;
      font-size: 30px;
      font-family: David;
      margin-left: 550px;
  }
  </code></pre>
  
  <p>but that's won't work on different browsers and iphone and stuff, and i'm pretty sure it's possible but i just can't seem to find it.
  I'm assuming it's something like "display" or "position" or "overflow" but nothing seem to work..</p>
  
  <p>Thanks in advance.</p>
  
  <p>The code is: </p>
  
  <pre><code>&lt;body&gt;
      &lt;div class="container"&gt;
  
          &lt;div class="header"&gt;
  
              &lt;div class="logo"&gt;
                  &lt;img src="http://www.saludmedellin.com/wp-content/uploads/2014/01/dfd1.jpg" /&gt;
              &lt;/div&gt;
  
              &lt;div class="text1"&gt;
                  Stocks Trader
              &lt;/div&gt;
  
          &lt;/div&gt;
  
          &lt;div class="bodier"&gt;
              &lt;form&gt;
                  &lt;input type="text" /&gt;
                  &lt;input type="submit" /&gt;
              &lt;/form&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
  
  &lt;/body&gt;
  </code></pre>
  
  <p>and the css:</p>
  
  <pre><code>body
  {
      background-color: #c4dbe5;
  }
  
  .header
  {
      background-color: #5a9ab7;
      border-radius: 10px;
      height: 100px;
  }
  
  .logo img
  {
      width: 80px;
      height: 80px;
      float: left;
      padding: 10px;
  }
  
  .text1
  {
      line-height: 450%;
      font-size: 30px;
      font-family: David;
      text-align: center;
  }
  </code></pre>