title: How to center two columns using CSS?
body: <p>I'm trying to center two columns on my website but there are some problems. The result of every change is left position (see <a href="http://i46.tinypic.com/5tov7.jpg" rel="nofollow noreferrer">picture</a>). What am I doing wrong? Here's my CSS:</p>
  
  <pre><code>body {
      background - image: url("../img/gray.png");
  }
  
  #header {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 100px;
      background: #cc0000;
      text - align: center;
  }
  
  #wrapper {
      margin: 100px;
      width: 1280px;
  }
  
  #leftcolumn {
      float: left;
      background - image: url("../img/gray.png");
      margin: 10px 0px 10px 0px;
      padding: 10px;
      height: 682px;
      width: 460px;
  }
  
  #rightcolumn {
      float: left;
      color: #333;
      border: 1px solid # ccc;
      background: #F2F2E6;
      margin: 10px 0px 10px 0px;
      padding: 10px;
      height: 500px;
      width: 439px;
      display: inline;
      position: relative;
  }
  </code></pre>
  
  <p>Thanks</p>