ブートストラップアコーディオン崩壊シェブロンアイコン（追加ボタン付き）

Question

私はページレイアウトを整理するためにアコーディオン倒壊を伴うブートストラップパネルを使用しています。折りたたみ可能な各パネルには、タイトルバーの右側にシェブロンが付いています。

シェブロンのすぐ左にボタンを追加したいのですが、どのようにしてボタンを追加したいのですか？

問題を強調するには、Fiddleのコードを作成しましたが、パネルのヘッ​​ダーコードは次のとおりです。

<div class="panel-heading"><h4 class="panel-title"><a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#TS0002-collapsePanel-1">My title</a> </h4> 
    <div class="input-group"> 
    <div class="input-group-btn"> 
     <button type="button" class="btn btn-info btn-xs">Save <span class="glyphicon glyphicon-floppy-save"></span></button> 
    </div>  
    </div> 
</div> 

は、私は、パネルのヘッ​​ダーの右側にあるボタングループのいくつかの例を見てきましたが、アコーディオンの崩壊の唯一の例は、私が使用するのhrefを見つけたし、私は2つをマージする方法がわかりません。どんな援助も感謝して受け取ります。

ありがとうございました。

Answer 1

あなたがそうのように、それはトグル山形の横に表示されるように、右隣のアンカーリンクへ、H4内に直接ボタンを配置し、右側にそれを整列するためにCSSを使用することができます。

<h4 class="panel-title"> 
    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#TS0002-collapsePanel-1">My title</a> 
    <button type="button" class="btn btn-info btn-xs mySaveButton">Save <span class="glyphicon glyphicon-floppy-save"></span></button> 
</h4> 

cssとJSを含む同じものを表示するようにフィドルが更新されました：https://jsfiddle.net/eLb20n2t/9/