無法對齊UI Bootstrap Accordion標題中的（垂直 - 中間）按鈕

我需要UI Boostrap Accordion組項目標題部分的按鈕。我能夠添加標記並且它可以工作，但是隻要我添加類pull-right，按鈕就不在中間（垂直）。 Click here查看Plunker。沒有課堂，按鈕被正確定位和對齊。無法對齊UI Bootstrap Accordion標題中的（垂直 - 中間）按鈕

來源

2017-05-12 Web User

圍繞uib-accordion標題中的文本和按鈕包裝span。使用display:inline-flex; width: 100%; justify-content: space-between; align-items: baseline;設置範圍。

<uib-accordion-heading> 
    <span style="display:inline-flex; width: 100%; justify-content: space-between; align-items: baseline;"> 
    I can have markup, too! <button class="btn btn-primary btn-sm">OPEN</button> 
    </span> 
</uib-accordion-heading>

Updated plunker

來源

2017-05-12 20:55:18 HaveSpacesuit

這樣的作品，謝謝！有沒有更簡潔的方法來做到這一點？我想我可以創建和重用一個類。 –

我相信有更好的方法來做到這一點。當我需要快速入門以獲得某些功能時，我總是會去彈出框。它只適用於你想要的方式，因爲有兩個項目。如果您添加了另一個項目，「space-between」會將它們均勻分佈在整個行上。但只有兩件，它的效果很好。 – HaveSpacesuit

我看到Safari中的解決方案存在對齊問題。出於某種原因，這些按鈕以不均勻的方式向[header]面板的中心移動。 Chrome和Firefox工作得很好。任何想法，爲什麼這可能是？ –

無法對齊UI Bootstrap Accordion標題中的（垂直 - 中間）按鈕

回答

相關問題