html - ブートストラップ パネル タイトルでの div と span での省略記号の使用

Question

「Nulla vitae quam a velit dictum tincidunt. Maecenas...」というテキストと同じ行にボタンを配置するにはどうすればよいですか?

私はこれを使用しています

style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"

そのため、行はパネル サイズで終了します。それがないと、テキストが十分に大きくない場合、ボタンとテキストは同じ行にとどまります。

http://jsfiddle.net/Khrys/4PHAE/

<div class="col-md-4">
    <div class="panel panel-default">
        <div class="panel-heading" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
            <span>Nulla vitae quam a velit dictum tincidunt. Maecenas sed dapibus nunc.</span>
            <div class="btn-toolbar pull-right">
                <div class="btn-group">
                    <a href="#" class="btn btn-default btn-xs">?</a>
                    <a href="#" class="btn btn-default btn-xs">!</a>
                </div>
            </div>
        </div>
        <div class="panel-body text-center">
            <p class="lead" style="margin-bottom: 0px;">Description</p>
        </div>
        <div class="panel-footer" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"><small>Iten #1, Iten #2, Iten #3, Iten #4, Iten #5, Iten #6, Iten #7, </small></div>
    </div>
</div>