I'm trying to figure out the best way to create a row of three boxes (columns), with dividers between boxes 1 and 2, and boxes 2 and 3. The text would need to be centered within each box.

  h2 {
    color: #00ADEF;
    margin-top:0;
  margin-bottom:0;
    font-family:Arial, Helvetica, sans-serif;
    font-size:20px;
    font-weight:bold;
    line-height:23px;
    }

    p {
  margin-top:0;
    }

    .3colwrapper {
        width: 930px;
        margin: 0 auto;
    }

    .colbox {
        float:left;
        margin: 10px;
        width: 210px;
        background:#DDD;
        padding:10px 40px;
    }

<div class="3colwrapper">
  <div class="colbox"><h2>Step One</h2>
<p>Sign up</p>
    </div>
    <div class="colbox"><h2>Step Two</h2>
<p>Verify</p>
    </div>
    <div class="colbox"><h2>Step Three</h2>
<p>Participate</p>
    </div>        
</div>

Here's what I've worked up so far: http://cssdesk.com/YyjAr