html - 将DIV放置在窗体的右侧

Question

我在表单中有一个 div，我想将 div 放在表单的右侧，并且 div 必须用按钮固定在右侧。我不知道这是否可以完成，但我该如何完成。

HTML

<form class="form-horizontal" method="post">
   <div class="form-group">
      <label for="name" class="col-lg-1 control-label"> Name</label>
      <div class="col-lg-6">
         <input type="text" class="typeahead form-control" id="name" placeholder="Name" name="name" required>
      </div>
   </div>
   <!--i want to move this div to the right side of the form and fixed-->
   <div  style="background-color:white" class="move-right" id="move-right">
      <legend style="text-align: center" >Heading <span></span></legend>
   </div>
   <div>
      <button type="submit" class="btn ">Save</button>
   </div>
</form>
</div>

Answer 1

如果权利的内容应该不重叠您需要的其他内容:

.move-right { float :右； 在 css 中。 并重新排序 html 代码以将 float 元素放在其他元素之上:

    <form class="form-horizontal" method="post">
       <div  style="background-color:white" class="move-right" id="move-
right">
          <legend style="text-align: center" >Heading <span></span></le zgend>
       </div>
       <div class="form-group">
          <label for="name" class="col-lg-1 control-label"> Name</label>
          <div class="col-lg-6">
             <input type="text" class="typeahead form-control" id="name" 
placeholder="Name" name="name" required>
          </div>
       </div>
       <div>
          <button type="submit" class="btn ">Save</button>
       </div>
    </form>

否则，如果内容可以重叠:

使用 .move-right { position: absolute;右:0px； 和 .form-horizo​​ntal { position: relative; CSS 代码。