Twitter引导程序样式无法按预期运行

Question

在下面的jsfiddle中，我有一个带有输入和提交的内联表单。当我减小屏幕尺寸时，输入跳跃为100％宽度 - 这显然是响应性的开始。问题是提交按钮没有得到100％宽度应用....这是我期望的引导程序已经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/

Answer 1

Bootstrap默认情况下不会在任何断点处使button个元素100％宽，您必须自己完成，在这种情况下使用媒体查询。例如：

@media (max-width: 767px) {
    .btn {
        width: 100%; 
    }
}

示例：http://jsfiddle.net/orettyqv/1/