Left / right float button inside div

Question

How can I make a float button only in a div area?

Here is my css and html example ..

HTML

<div class='test'> <div style='float: left;'> <button>test</button> </div> <div style='float: right;'> <button>test</button> </div> </div> 

CSS

 .test { width:60%; display:inline; overflow: auto; white-space: nowrap; margin:0px auto; } 

or you can see a live sample here → http://jsfiddle.net/ELAVS/

I want this to be so.

Answer 1

Change display: built-in to display: built-in unit

 .test { width:200px; display:inline-block; overflow: auto; white-space: nowrap; margin:0px auto; border:1px red solid; }