An answer to the question located at: https://groups.google.com/d/topic/roots-theme/j5zuiGoX2RI/discussion

index.html

<div class="row" style="color:#f0f0f0;">
  <div id="foo" class="span4 bar">
    <div class="apply-bg-here">
      <h3>Box 1 Title</h3>
      <div class="textwidget">
        Put a lot of info here like the font should be #f0f0f0 and the background should be #232728 and that lipsum cume laude is greek for taking up space.
      </div>
    </div>
  </div> <!-- END SPAN 4 -->

 <div class="span4 bar">
   <h3>Box 2</h3>
   <div class="textwidget">
     Put a lot of info here like the font should be #f0f0f0 and the background should be #232728 and that lipsum cume laude is greek for taking up space.
   </div>
  </div> <!-- END SPAN 4 -->

 <div class="span4 bar">
   <h3>BOX 3</h3>
   <div class="textwidget">
     Put a lot of info here like the font should be #f0f0f0 and the background should be #232728 and that lipsum cume laude is greek for taking up space.
   </div>
  </div> <!-- END SPAN 4 -->
</div>

style.css

div.span4 {
  padding-left:30px;
  float:left;
  width:300px;
}

div.span4,
#foo div.apply-bg-here { 
  background:#232728; 
}

#foo { 
  background:transparent; 
}

div.bar h3 {
  margin-top:0;
  padding-top:20px;
}