Arrange CSS rounded box side-by-side

How to arrangeCSS rounded box

[arrezes]

Hi,

I'm trying to arrange CSS rounded-boxes side by side. i want to limit only two-boxes per line.

how possible is that?

[arrezes]

maybe i need to explain a little bit further

CSS code
[codes]
<style type="text/css">
.top {background: url("images/box/bgbox_2.jpg") 0 0 repeat-x;}

</style>
[/code]

and this is the html codes
[codes]
<div style="width: 100%; background-color: #bbbbbb;">
<div style="float:left; position:relative; left:50%;">
<div style="position:relative; left:-50%;">
<div style="background: url(images/box/bgbox_2.jpg) 0 0 repeat-x;">
<div style="background: url(images/box/bgbox_6.jpg) 0 100% repeat-x;">
<div style="background: url(images/box/bgbox_8.jpg) 0 0 repeat-y;">
<div style="background: url(images/box/bgbox_4.jpg) 100% 0 repeat-y;">
<div style="background: url(images/box/bgbox_7.jpg) 0 100% no-repeat;">
<div style="background: url(images/box/bgbox_5.jpg) 100% 100% no-repeat">
<div style="background: url(images/box/bgbox_1.jpg) 0 0 no-repeat">
<div style="background: url(images/box/bgbox_3.jpg) 100% 0 no-repeat;">
<div style="padding:30px;">
<img src="images/fila.jpg" />
<p>Lorem ipsum dolor sit amet, consectetur adipisicing
elit, sed do eiusmod tempor incididunt ut labore et
dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip
ex ea commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>

</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!--end of rounded box-->
</div>
</div>
[/code]

i want to arrange this box to have two boxes in a line