I am trying to position containers within a main container but I am having problems with changing the length.

The CSS code that I am using is:

#container-2 {position: absolute;
         top: 315px;
         left: 270px;
/* this is width that I want the container to be: inspect element shows 228 x 43 */
         width: 358px;  
         height: 35px;
         font-family: arial;
        font-size: 1.00em;
	border-style: outset;
        border-color: #c0c0c0;
        border-width: 4px;
        width: 220px;
.slide-info {position: absolute;  /* position to left of container */
           left: 10px;
           top: 5px;
           width: 150px;
.buttns {
           position: relative;  /* position next to slide-info */
           top: 5px;
           left: 140px;
For some reason I am unable to re-size container-2. It's present size was what I used to position it.
I am also unable to get the 2 inner contianers to show at the same level. The container with the width problem is yellow. You can see what I mean here

How can I correct this?
Thanks for your help.