Question

我有一个简单的导航栏，其中一个按钮向右浮动，当我将显示尺寸更改为XS（手机视图）按钮跳转到下一行时，如何保持它向右浮动并与品牌名称在同一行？< / p>

<nav class="navbar navbar-inverse">
  <div class="container">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">BjjBase.com</a>
    </div>
    <button type="button" class="btn btn-success navbar-btn navbar-right">+ Submit Event</button>
  </div>
</nav>

http://www.bootply.com/tZN98fGOmL

Answer 1

navbar-header更改为100％宽度，768像素或更低（xs），因此您可以将其删除以防止垂直堆叠..

<nav class="navbar navbar-inverse">
  <div class="container">
    <a class="navbar-brand" href="#">BjjBase.com</a>
    <button type="button" class="btn btn-success navbar-btn pull-right">+ Submit Event</button>
  </div>
</nav>

http://bootply.com/n1V0BBnVRJ

导航栏中的浮动右按钮跳转到XS显示的下一行

1 个答案: