CSS幫助 - 浮動右忽略保證金

Question

我有一個表單中的兩個按鈕，我想要一個向左（前一個）和另一個向右（下一個/提交）。問題是當我隱藏了前一個按鈕（當我在表單的第一個選項卡上時），下一個/提交按鈕懸停在內容之外。當前一個按鈕被隱藏時，如何讓按鈕按我想要的方式定位？

ASP.NET：

<div id="formContainer" style="padding:20px; margin-top:50px; margin-bottom:20px; width:600px; margin-left:auto; margin-right:auto; border:solid black 1px;background-color:#c6c6c6"> 
     <div id="recipeForm1"> 
       <!-- OMMITTED FOR Length Purposes --> 
     </div> 
     <div id="recipeForm2"> 
      <!-- OMMITTED FOR Length Purposes --> 
      </table> 
     </div> 
     <div id="recipeForm3"> 
      directions 
     </div> 
     <div id="recipeForm4"> 
      Nutrition 
     </div> 

     <div id="recipeForm5"> 
      review 
     </div> 
     <div id="buttons"style="margin-left:auto; margin-right:auto; padding-top:30px;"> 
      <input id="btnPrevious" type="button" value="Previous" /> 
      <input id="btnNext" type="button" value="Next" style=" float:right;" /> 
     </div> 

    </div> 

使用jQuery .show和.hide對配方的div和按鈕的需要。當我在recipeform1以前的按鈕是失蹤，形式如下：

我希望它看起來像這樣（減去以前出現）：

Answer 1

使用clearfix解決方案...

#buttons { 
    overflow: hidden; 
} 

這是因爲您已漂浮在下一個對接所以當先前的被隱藏時，其父元素摺疊（元素不會展開以默認包含浮動元素）。