html - Twitter Bootstrap: overflow of btn-group -

i have bunch of buttons inside div fixed width , auto height. want contained buttons shift next line once overflow container div.

here's code:

<div class='btn-group' style='width:100px; height:auto;'>   <button class='btn'>hello</button>   <button class='btn'>hello</button>   <button class='btn'>hello</button>   <button class='btn'>hello</button>   <button class='btn'>hello</button>   <button class='btn'>hello</button>   <button class='btn'>hello</button> </div> 

the buttons out of group. doing <br /> helps i'd prefer if there more direct solution since inserting buttons programatically. thanks.

override whitespace property on .btn-group

.btn-group{     white-space: normal; } 

jsfiddle: http://jsfiddle.net/k9xcj/