引導面板頁腳按鈕右拉式

我有引導下列HTML元素：引導面板頁腳按鈕右拉式

<div class="panel-footer"> 
          <button type="button" id="btnSave" class="btn btn-default pull-right">Save</button> 
         </div>

如果你看到有一個灰色地帶（panel-footer）：

該按鈕使用pull-right類也是float:right，但我希望灰色區域實際上是panel-footerdiv適合在按鈕高度內。

這是panel-footer樣式：

這爲pull-right：

任何線索？

UPDATE：

我的按鈕後，補充道：

<div class="clearfix"></div>

而且似乎解決了這一問題。這可以嗎？

來源

2016-11-19 VAAA

嗨，你可以請發佈您的實際代碼的網址？我用bootstrap和html創建了一個codepen，它工作正常：http://codepen.io/anon/pen/dONeqV –

我運行了你在jsFiddle中提供的代碼，並得到了相同的結果。即使將按鈕放置在面板面板中（默認情況下），仍然會得到相同的結果。

這是一個修復。

我創建了一個jsFiddle

它包括兩個例如一個使用代碼的重寫和一個使用面板面板默認和麪板體具有的CSS重寫。

希望有幫助。

.panel-footer { 
 
    height: 50px !important; 
 
} 
 

 
#sep { 
 
    margin-top: 10px; 
 
} 
 

 
.panel-body { 
 
    background: #f3f3f3 !important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="panel-footer"> 
 
    <button type="button" id="btnSave" class="btn btn-default pull-right">Save</button> 
 
</div> 
 
<div id="sep"></div> 
 
<div class="panel panel-default"> 
 
    <div class="panel-body"> 
 
    <button type="button" id="btnSave" class="btn btn-default pull-right">Save</button> 
 
    </div>

來源

2016-11-20 00:32:15 jameswassinger

你可以試試這個。

<div class="panel-footer text-right"> 
    <button type="button" id="btnSave" class="btn btn-default pull-right">Save</button> 
</div>

你只需要文本右類添加到您的面板頁腳。

它適用於我。

來源

2017-06-15 07:14:24

引導面板頁腳按鈕右拉式

回答

相關問題