twitter-bootstrap Bootstrap 文本框未拉伸全宽
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/22181636/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap text box not stretching full width
提问by Hyman Bonneman
Why is the text box in my form not stretching further on full size screen? It seems rather short!
为什么我的表单中的文本框在全尺寸屏幕上没有进一步拉伸？好像比较短！
<!-- row: 4 -->
<div class="row base-padding fill-dark">
<div class="col-md-8 no-padding">
<h2 class="white base-padding-bottom">SIGN UP FOR OUR NEWSLETTER</h3>
<p class="light-grey">Receive exclusive promotions, <strong>free passes</strong> for <strong>family and friends</strong> and links to our weekly ad!</p>
<br>
</div>
<div class="col-md-4 no-padding">
<h2 class="white base-padding-bottom">EMAIL ADDRESS</h3>
<form class="form-inline" role="form">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail2">Email address</label>
<input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
</div>
<button type="submit" class="btn btn-default">Sign in</button>
</form>
</div>
</div>
回答by Hyman Bonneman
When you use the inline form included in Bootstrap, you have to set a width for the inputmanually.
当您使用 Bootstrap 中包含的内联表单时，您必须input手动设置宽度。
From the Bootstrap documentation:
Inputs, selects, and textareas are 100% wide by default in Bootstrap. To use the inline form, you'll have to set a width on the form controls used within.
Bootstrap 中的输入、选择和文本区域默认为 100% 宽。要使用内联表单，您必须在其中使用的表单控件上设置宽度。
It appears you need to use a pixel (px) value when setting the inputwidth. When I try setting it with a percentage value it doesn't work correctly, at least on my end.
设置input宽度时，您似乎需要使用像素 (px) 值。当我尝试使用百分比值设置它时，它无法正常工作，至少在我这边是这样。
If you add something like this to your stylesheet, you should be able to size the text box how you need it. Just change the 256 to however long you need.
如果您将这样的内容添加到样式表中，您应该能够根据需要调整文本框的大小。只需将 256 更改为您需要的长度即可。
.form-inline .form-control {
width: 256px;
}
If I understand the Bootstrap documentation correctly, it doesn't use the .form-inlinestyling on smaller screens (<768px wide), so you should be fine there. Hope this helps.
如果我正确理解 Bootstrap 文档，它不会.form-inline在较小的屏幕（<768px 宽）上使用样式，所以你应该没问题。希望这可以帮助。
