html - Bootstrap - input-group-btn 想要向右浮动

标签 html css twitter-bootstrap

所以我在网站上构建了一个导航栏,其中包含一个搜索栏以及一个分组按钮。它在桌面 View 上运行良好,但当我缩小到移动 View 并且网站生成可折叠菜单时,搜索栏保持在左侧,但按钮漂浮在右侧。当我使用围绕它的 input-group-btn 类删除跨度时,我没有遇到这个问题。

<form class="navbar-form navbar-left form-inline" role="search">
    <div class="row">
        <div class="input-group">
            <input type="text" class="form-control" style="width: 250px;"/>
            <span class='input-group-btn'>
                <button type="button" class="btn btn-default" aria-label="Search">
            <span class="glyphicon glyphicon-search" aria-hidden="true"></span>
                </button>
            </span>
        </div>
    </div>
</form> 

包括图片 http://bit.ly/1G706rC

编辑:我解决了我自己的问题!我只需要向 span 添加一个 pull-left

最佳答案

问题可能与要固定为 px 的文本输入的宽度有关。尝试以百分比 (%) 为单位的相对度量,它可能会起作用,因为它会根据窗口大小调整大小。

关于html - Bootstrap - input-group-btn 想要向右浮动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29800807/

相关文章:

javascript - 无法让 JQuery 附加一些 html 和值

php - HTML 多 anchor 名称

html - 在内联元素中的下一行显示文本

javascript - Bootstrap 下拉列表不能连续工作

css - LESS 编译器神奇地将不需要的类添加到我的选择器中

javascript - 标准化 SVG 以方便存储

javascript - 更改节点列表中的所有元素

css - ng-table 可排序标题的选择器

HTML 和 CSS 定位

css - 从 css(而不是 html)继承我所有表的 Bootstrap 类