Html CSS帮助-右浮动忽略边距

我在表单中有两个按钮，我想将一个按钮放在左边（上一个），另一个放在右边（下一个/提交）。问题是，当我隐藏了“上一个”按钮（当我在表单的第一个选项卡上这样做时），下一个/提交按钮将悬停在内容之外。当上一个按钮被隐藏时，如何将按钮定位到所需的位置

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>

方向
营养
回顾

我根据需要在配方div和按钮上使用jquery.show和.hide。当我在recipeform1上时，previous（上一个）按钮丢失，表单如下所示：

我希望它看起来像这样（减去之前出现的内容）： 使用clearfix解决方案

#buttons {
     overflow: hidden;
}

发生这种情况是因为您将“下一步”按钮浮动到右侧，因此当上一个按钮隐藏时，其父元素将折叠（默认情况下，元素不会展开以包含浮动的元素）。

使用clearfix解决方案

#buttons {
     overflow: hidden;
}

---

之所以会出现这种情况，是因为您将“下一步”按钮浮动到右侧，因此当上一个按钮隐藏时，其父元素将折叠（默认情况下，元素不会展开以包含浮动的元素）。

啊，这就解决了它！谢谢：）啊，这就解决了！谢谢：）