在下面的jsfiddle中,我得到了一个带有输入和提交的内联表单。当我缩小屏幕大小时,输入跳转到100%宽度-这显然是响应能力的发挥。问题是提交按钮没有应用100%宽度。。。。如果bootstrap已经将100%应用于输入,这是我所期望的。
有什么想法吗?
<form class="form-inline" role="form" style="width: 350px; margin: 0 auto;">
<div class="form-group" >
<label for="postcode" class="sr-only">Postcode:</label>
<input type="text" class="form-control input-lg" id="email" placeholder="Postcode">
</div>
<button type="submit" class="btn btn-primary btn-lg">Submit</button>
</form>
http://jsfiddle.net/orettyqv/
Bootstrap在任何断点默认情况下都不会使button
元素的宽度为100%,您必须自己完成,在本例中使用媒体查询。例如:
@media (max-width: 767px) {
.btn {
width: 100%;
}
}
示例:http://jsfiddle.net/orettyqv/1/