Twitter bootstrap 仅为一项导航栏防止xs崩溃-引导3

Twitter bootstrap 仅为一项导航栏防止xs崩溃-引导3,twitter-bootstrap,twitter-bootstrap-3,Twitter Bootstrap,Twitter Bootstrap 3,是否有一种方法可以防止“使用twitter登录”按钮在xs分辨率下崩溃,而无需重新编译bootstrap.css?也许将“登录”按钮与“上一步”和“下一步”按钮保持在同一导航栏div中,但使用javascript或其他css黑客从上面的“搜索”按钮复制x坐标 编辑:这是小提琴: 这是代码: <div class="navbar-form navbar-left"> <div class="btn-group btn-group-sm left-off

是否有一种方法可以防止“使用twitter登录”按钮在xs分辨率下崩溃,而无需重新编译bootstrap.css?也许将“登录”按钮与“上一步”和“下一步”按钮保持在同一导航栏div中,但使用javascript或其他css黑客从上面的“搜索”按钮复制x坐标

编辑:这是小提琴:

这是代码:

      <div class="navbar-form navbar-left">
        <div class="btn-group btn-group-sm left-offset">
          <button type="button" class="btn btn-default">Previous</button>
          <button type="button" class="btn btn-default">Next</button>
        </div>
      </div>

      <div style="margin-right: 10px; float:right;" class="navbar-form navbar-right">
          <img class="left-offset" height="29px" width="29px" style="margin-top:1px;" src="./images/avatar.png" />
          <button type="button" class="btn btn-default btn-sm">Sign in with Twitter</button>
      </div>

以前的
下一个
使用Twitter登录
这就是目前的情况


您创建的小提琴使用的是BS 2,但看起来您想要使用版本3,所以我做了以下引导:

我将删除覆盖引导CSS的内联样式,并将您不希望折叠的内容放入
导航栏标题中

<nav class="navbar navbar-default" role="navigation">  
    <div class="navbar-header">

      <a class="navbar-brand" href="#">Brand</a>

      <ul class="nav navbar-nav">
        <li></li>
        <li><a href="#">Link 1</a></li>
      </ul>

      <div class="col-sm-5">
        <form class="navbar-form pull-left">
          <div class="form-group" style="display:inline;">
            <div class="input-group">
              <input type="text" class="form-control">
              <span class="input-group-addon"><span class="glyphicon glyphicon-search"></span></span>
            </div>
          </div>
        </form>
      </div>

      <div class="pull-right">
      <button type="button" class="navbar-btn btn btn-default">Sign in with Twitter</button>&nbsp;&nbsp;
      </div>

      <div class="col-sm-3">
        <button type="button" class="navbar-btn btn btn-default">Prev</button>
        <button type="button" class="navbar-btn btn btn-default">Next</button>
      </div>

    </div>
</nav>

使用Twitter登录 上 下一个

我不明白这个问题。看这张照片。“使用twitter登录”按钮应该是红色的“此处”。将整个问题和您尝试过的内容放在一把小提琴上。这是我用链接编辑的帖子。@ImeIme检查一下这个提琴,我想让它在“搜索”和“上一个”按钮之间折叠。选中@Sujrits css fiddle,它正是我想要的。