1

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

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 上时，前一个按钮不见了，表单看起来像：

在此处输入图像描述

我希望它看起来像这样（减去以前的出现）： 在此处输入图像描述

4

1 回答 1

4

使用clearfix解决方案...

#buttons {
     overflow: hidden;
}

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

于 2013-03-23T22:47:31.250 回答