Bootstrap 3表单对齐

Question

我正在使用Bootstrap 3，我想在整个页面上覆盖整个表单，如附加图像，在图像中我正在使用kendo UI弹出窗口。弹出窗口宽度为1000px

这是我的HTML代码，

<section class="container-fluid padding-rl">
<div class="row">
  <div class="col-sm-3">
         <div class="profile-box">
             <img class="profile-picture" src="" alt="" />
         </div>
     </div>
     <div class="col-sm-8">
         <div class="row">
             <div class="form-horizontal">
                 <div class="form-group">
                     <label class="control-label col-sm-1">First Name:</label>
                     <div class="col-sm-3">
                         <input type="text" class="form-control" data-bind="value: selectedRecord.FirstName" />
                     </div>
                     <label class="control-label col-sm-1 col-sm-offset-1">Last Name:</label>
                     <div class="col-sm-3">
                         <input type="text" class="form-control" data-bind="value: selectedRecord.LastName" />
                     </div>
                 </div>

                 <div class="form-group">

                     <label class="control-label col-sm-1">Email:</label>
                     <div class="col-sm-3" style="">
                         <input type="text" class="form-control" data-bind="value: selectedRecord.Email" />
                     </div>
                     <label class="control-label col-sm-1 col-sm-offset-1 ">Mobile:</label>
                     <div class="col-sm-3" style="">
                         <input type="text" class="form-control" data-bind="value: selectedRecord.Mobile" />
                     </div>

                 </div>
                 <div class="form-group">

                     <label class="control-label col-sm-1">Phone:</label>
                     <div class="col-sm-3" style="">
                         <input type="text" class="form-control" data-bind="value: selectedRecord.OfficePhone" />
                     </div>

                     <label class="control-label col-sm-1 col-sm-offset-1 ">Account:</label>
                     <div class="col-sm-3" style="">
                         <input type="text" id="txtContactAccount" class="form-control" data-bind="value: selectedRecord.ContactAccount" />
                     </div>

                 </div>
             </div>
         </div>
     </div>
 </div>

附图

提前谢谢

Answer 1

不幸的是，我没有在你的问题中看到你的代码。从样本图片中我猜你想要做的是创建一个模态？

在这里查看bootstrap的文档： Bootstrap JavaScript

向下滚动一下关于模态的部分，它们也有很好的样本。