bootstrap javascript data-toggle="button" 在平板电脑分辨率下不起作用答案

【问题标题】：bootstrap javascript data-toggle="button" doesn't work at tablet resolutionbootstrap javascript data-toggle="button" 在平板电脑分辨率下不起作用
【发布时间】：2014-10-06 17:08:34
【问题描述】：

当我将窗口大小调整为平板电脑分辨率时，我的切换按钮似乎失效了。悬停不起作用，单击不起作用。发生在我测试过的所有浏览器（IE、chrome 和 mozilla）的最新版本上。它适用于所有其他分辨率。我正在使用 bootstrap twitter css 和 js 3.2 和 jquery 1.11.1，但我没有自己的 .js 文件。提交按钮适用于所有分辨率。

   <form name="ProgramsForm" data-name="Signup Form">
      <div class="col-sm-3">
          <button type="button" class="btn btn-info btn-lg prg-btn" data-toggle="button">
                  buttonlabel
          </button>
      </div>    
      <div class="col-md-12">
          <input class="btn btn-primary btn-lg register-btn" type="submit" value="Submit" data-wait="Please wait...">
      </div>
   </form>

【问题讨论】：

除了 bootstrap 之外还有其他的 css 吗？
font-awesome 和我创建的一个小 css 文件。我都删除了，问题仍然存在。只是看起来更丑：p

标签： twitter-bootstrap

【解决方案1】：

好像和你使用 col-sm-3 类有关。

jsFiddle

<form name="ProgramsForm" data-name="Signup Form">
  <div class="col-md-3">
  <button type="button" class="btn btn-info btn-lg prg-btn" data-toggle="button">buttonlabel</button>
  </div>    
  <div class="col-md-12">
  <input class="btn btn-primary btn-lg register-btn" type="submit" value="Submit" data-wait="Please wait...">
  </div>
</form>

【讨论】：

【解决方案2】：

所有列必须包含在一行中。我将列封闭在<div class="row"> 中，现在可以使用了。

   <form name="ProgramsForm" data-name="Signup Form">
<div class="row">
      <div class="col-sm-3">
          <button type="button" class="btn btn-info btn-lg prg-btn" data-toggle="button">
                  buttonlabel
          </button>
      </div>    
</div>

  <div class="col-md-12">
      <input class="btn btn-primary btn-lg register-btn" type="submit" value="Submit" data-wait="Please wait...">
  </div>

【讨论】：