Bootstrap/CSS输入窗体不居中

Bootstrap输入窗体不居中，即使我将它设置为。这里是什么样子：Bootstrap/CSS输入窗体不居中

表不居中：

enter image description here

适形

enter image description here

红色的问题，绿色是我想要的。这是代码。

CSS：

.form-control { 
    height: 50px; 
    width: 330px; 
    padding-left: 5px; 
    font-size: 20px; 
    font-family: 'Lato', sans-serif; 
}

HTML：

  <form class="form-inline" role="form"> 
       <div class="form-group"> 
        <label class="sr-only" for="exampleInputEmail2">Enter email address</label> 
        <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email address"> 
       </div> 
       <div class="form-group"> 
        <button type="submit" class="btn">Early Access</button> 
       </div> 
      </form>

所有帮助将是惊人的，谢谢。

来源

2014-07-07 Justin

请问this是否解决了您的问题？

只是增加了一个包装周围：

#wrapper { 
    text-align:center; 
} 

.form-control { 
    margin: 0 auto; 
}

来源

2014-07-07 01:48:24 bryce

不，这没有工作，没有什么改变。 – Justin

那么你需要发布更多的代码。这适用于你发布的内容。 – bryce

您的JSFiddle示例不起作用。检查出来，它与我遇到的同样的问题。表格粘在左边。 – Justin

如何沿着这些线路的东西：

包装你的东西有<div class="container">，中心应有尽有。
将ID添加到同一个div，并将宽度设置为任何你想要的。
将按钮的宽度设置为100％。

HTML：

<div class="container" id="myContainer"> 
    <form class="form-inline" role="form"> 
     <div class="form-group"> 
      <label class="sr-only" for="exampleInputEmail2">Enter email address</label> 
      <input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email address" /> 
     </div> 
     <br> 
     <div class="form-group"> 
      <button id="earlyAccessBtn" type="submit" class="btn">Early Access</button> 
     </div> 
    </form> 
</div>

CSS：

#myContainer { 
    width: 350px; 
} 

#earlyAccessBtn { 
    width: 100%; 
}

DEMO

来源

2014-07-07 02:16:41

谢谢，这也工作！ – Justin

Bootstrap/CSS输入窗体不居中

回答

相关问题