css - wrap div around other divs -

i'm trying div wrap around 2 other divs. this:

is possible? tried float:left; , have small divs display:block; didn't work.

thanks.

edit: inside each div, add pictures:

something this:

http://jsfiddle.net/tvcc8/1/

float 2 right containers , keep large container block element. display boxes inside large block element inline-block.

<div id='wrapper'> <div id='one'><ul><li></li><li></li></ul></div> <div id='two'><ul><li></li><li></li></ul></div> <div id='three'><ul>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>     <li></li>         <li></li>     <li></li>   </ul></div> 

and css:

ul {list-style-type: none; margin:0; padding:0;} li { width:20px; height:20px; margin:2px;} #one {border: 1px solid blue; float: right;} #one li {background-color: blue;} #two {border: 1px solid green; float: right;} #two li {background-color: green;} #one ul, #two ul {margin:4px 1px 1px 1px;} #three {border: 1px solid orange;} #three ul {margin:4px;} #three li {background-color: orange; display:inline-block; margin:0;} #wrapper {width:105px;}