title: HTML/CSS left and right div side by side on Chrome but not on Safari/Firefox
body: <p>I am having a hard time aligning divs side by side in Firefox and Safari, however it works great in Chrome. It is hard to give all the css because I have a mobile stylesheet, a normal one, and then the print one which is the one in question. The other stylesheets work great. If more information is needed to solve this please let me know.</p>
  
  <p>My website is at <a href="http://bidonmoving.com/Template1/website.php" rel="nofollow noreferrer">http://bidonmoving.com/Template1/website.php</a> for more details</p>
  
  <p>A image of the Chrome page:
  <img src="https://i.stack.imgur.com/OO4AJ.png" alt="http://bidonmoving.com/Resify/Resumes/Template1/images/chrome.png"></p>
  
  <p>A image of the Firefox page:
  <img src="https://i.stack.imgur.com/kefTS.png" alt="http://bidonmoving.com/Resify/Resumes/Template1/images/firefox.png"></p>
  
  <p>My HTML setup is basically as follows:</p>
  
  <pre><code>&lt;div class="page"&gt;
      &lt;div class="content"&gt;
                      &lt;div class="left-content"&gt;&lt;/div&gt;
                      &lt;div class="right-content"&gt;&lt;/div&gt;
              &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>And the CSS is:</p>
  
  <pre><code>.page {
      clear:both;
      background-image: none;
      background-color:none;
      margin: 50px auto;
      margin-left:30px;
      border:0;
      outline:none;
  }
  .content {
      clear: both;
      margin: 0px auto;
      width: 1000px;
      background: #ccc;
      position: relative;
      border:0;
      outline:0;
      -webkit-box-shadow:none;
      -webkit-box-shadow:none;
  }
  .left-content{
      width:450px;
      text-align:left;
  }
  .right-content{
      width:450px;
      position:absolute;
      margin-top:0px;
      padding-top:0px;
      margin:0px;
  }
  </code></pre>