Can someone tell me how to get a div to the right of current div? See site

Question

I'm tryin so hard to do an all CSS site instead of using tables. Very tough! Can someone look at http://www.duenorthdesign.com/pcm and tell me:
1) How to get a new div to line up to the right of the current (light green) one. Currently it is below it. I"ve tried floating the left one left so the new div would go to the right. Strange results! Tried floating it to the right.... UGH. I've never felt so stupid in my life!
2) Also, why does my content run outside of my div (the light green article)? Shouldn't the div expand accordingly?
Thanks so much, you are all so helpful!

Answer 1

Both your questions can be answered by amending your css selector from this :
.twoColFixLtHdr #container #mainContent #feature2 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    line-height: 20px;
    height: 300px;
    width: 300px;
    background-color: rgba(240,244,230,1);
    margin-top: 10px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding: 5px;
To this:
.twoColFixLtHdr #container #mainContent #feature2 {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    line-height: 20px;
    width: 300px;
    float: left;
    background-color: rgba(240,244,230,1);
    margin-top: 10px;
    padding: 5px;
and this one:
.twoColFixLtHdr #mainContent {
    padding: 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    background-color: #FFF;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 203px;
to this:
.twoColFixLtHdr #mainContent {
    padding: 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    background-color: #FFF;
    overflow: hidden;
Then add this one to your css styles:
#feature3 {
float: left;
width: 300px;
margin-left: 20px;
display: inline;