I'm Trying To Get This To Work And Am Clueless Why It Doesn't

Ok, I'm trying to make a menu with buttons on top of another background....I'd like to make 3 buttons across and 2 rows.....I can't get my brain to form around what is going on, here is what I have on the css side

/*----------Rightboxmenu---------------*/
.rightContainer {
	float: left;
	width: 215px;
	background-color: #FFFFFF;
}

.box {
	margin: 0px 0px 10px 4px;
}

.rightboxMiddle {
	float: left;
	background: url("../images/boxMiddler3.gif") repeat-y;
	width: 240px;
}


.rightboxBottom {
	background: url("../images/boxBottomr2.gif") no-repeat;
	width: 240px;
	height: 2px;
}

.rightboxseperator  {
	float: left;
	background: url("../images/seperator1r2.gif") repeat-x;
	width: 240px;
	height: 1px;
}

.controlbuttona   {
	
	padding:15px 0px 0px 10px;
}

.controlbuttonb  {
	
	padding: 5px 0px 20px 95px;
}

.controlbuttonsep1  {
	background: url("../images/controlButtonsep1.gif") no-repeat;
	width: 5px;
	height: 25px;
	
	
	}

.controlbutton1  {
	
	background: url("../images/controlButton2.gif") repeat-x;
	text-align: center;
	width: 80px;
	height: 25px;	
	font-weight: bold;
	padding: 5px 0px 0px 0px;

Code (markup):

And here's the html

<div class="rightContainer">


	
  <div class="box">
    <div class="rightboxseperator">		
	  <div class="rightboxMiddle">
	  
	    <div class="controlbuttona">
	      <div class="controlbutton1"><a href="{$smarty.const.DOC_ROOT}/index.php?list=latestarticles" title="{l}Browse latest articles{/l}">{l}Articles{/l}</a></div>
        </div>
	    <div class="controlbuttonb">
	       <div class="controlbutton2"><a href="{$smarty.const.DOC_ROOT}/index.php?list=latestarticles" title="{l}Browse latest articles{/l}">{l}Second{/l}</a></div> 
	    </div>
	  </div>  
	<div class="rightboxBottom"></div>    

Code (markup):

I can't for the life of me figure out how to get boxes to show up on the same line next to each other without breaking the rest of the layout such as the background image disappearring, or just hugging the left side etc????

 

Uh, I need to see a picture of what you want.

 

goto yahoo.com and look at the right column, the menu they have there with the white buttons for mail, messenger, radio...then on the second line weather, local, horoscope....3 buttons per line on top of a background

 

Well, I know how to make something end up like the yahoo page no problem but your html example seems to only have two buttons? Articles and Second?

I also think, looking at the code you did post, that you've got a lot more containers and classes and stuff than you really need, which of course makes it harder for you to get it to work...
Clarify this button thing, we'll get it sorted out. : )