引導崩潰和填充問題

我使用的是過渡崩潰。下面的代碼工作，但因爲我有10px的填充在我的樣式表我看到div合攏，但它應該然後消失之前停止10px的。當div擴大到10px時，反過來也是如此，因爲它會在回彈到正確尺寸之前擴大。引導崩潰和填充問題

HTML

<div ng-controller="MainCtrl" class="box-content collapse" id="mybox"> 
          Lorem ipsum ... 
</div>

CSS

.box-content{ 
    background: red; 
    padding: 10px; 
}

來源

2013-09-23 user1853235

容易 - 只需添加一個崩潰具有造型

來源

2013-09-23 12:36:38 user1853235

實際上沒有工作對我來說，唉。仍然跳躍。 – jrochkind

如果您使用'.collapse'類引用樣式表中的內部div，因爲在動畫期間'collapse'類將變爲'collapsing'。 – silenzium

如果你不想改變HTML結構內另一個div添加這些樣式：

/* Override bootstrap collapse to keep margins */ 
.collapse.in { 
    display: inherit; 
    visibility: visible; 
} 
.collapse { 
    display: inherit; 
    visibility: hidden; 
}

引導套顯示爲無時在動畫完成，從而消除了整個DIV，包括填充。將可見性設置爲隱藏不會刪除div，但它的高度爲0，所以剩下的就是填充。

確保這些樣式都引導樣式表之後定義。

來源

2015-03-12 17:38:39

您必須包裝在.collapse您的內容，如果你想擁有的填充，可以設置您的包裝的CSS。

HTML

<div ng-controller="MainCtrl" class="box-content collapse" id="mybox"> 
    <div class='wrapper'>     
    Lorem ipsum ... 
    </div> 
</div>

CSS

.wrapper{ 
    padding: 10px; 
}

來源

2015-10-19 17:35:35

我已經包裝了按鈕而不是內容，它適用於我。謝謝 – Paul

引導崩潰和填充問題

回答

相關問題