Simple column with CSS

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

I'm trying to create two columns within a gray box (#backdrop).  I've
setup a <div> for the graybox and thought I could nest another <div>
within it to get the border and separation that I was looking
for...but that didn't work.  What is screwing me up here? This isn't
as intuitive as I would have thought...


<style type="text/css">
div.sub {padding: 0; margin: 0 auto; width: 90%; max-width: 950px;}
#main {clear: both; text-align: center;}
#primary {width: 70%; padding-right: 2%;
  border-right: 1px solid #CCC;}
#backdrop {background-color:#aaaaaa; border:1px solid #ccc;}
.column {float: left; text-align: left; margin: 1.5em 0;}
.column1 {float: left; text-align: left; margin: 1.5em 0;
  width:50%; border-right:1px solid #ccc;}
<div id="main">
 <div class="sub">
  <div id="primary" class="column">
   <div id="backdrop">
    <div class="column1">
     Testing 2<br/>
    <div class="column">
     TEsting 3<br/><br/>
     Testing 4<br/>

Site Timeline