引导3表单对齐

我使用引导程序3，我想要在整个页面上覆盖整个表单，如附加图像，在图像中我使用的是kendo UI弹出窗口。弹出窗口宽度1000像素引导3表单对齐

这里是我的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>

附加的图像

预先感谢您

来源

2016-03-01 Naveed Iqbal

你能分享这个链接吗？ –

代码请.. !!! –

添加代码Ahsan Aziz –

不幸的是我没有看到你的代码在你的问题。从示例图片我猜你正在做的是创建一个模态？

看一看引导的文档在这里： Bootstrap JavaScript

向下滚动了一下，关于情态动词的一部分，他们有很好的样本有太多。

来源

2016-03-01 06:36:26

再次读这个问题，现在他已经添加了他的HTML（仍然缺少CSS，除非没有其他引导）我想这个问题可能是简单的如何将他的形式与右边模态的边缘，或者形式跨越所需模态区域的100％。 –

应该只是一个或两个CSS覆盖的问题 –

或者他可能希望实际的模式来填补整个窗口空间，如设置90％的宽度.... – blackhawk

引导3表单对齐

回答

相关问题