当前位置: 首页 > 知识库问答 >
问题:

bootstrap-input-group-btn要向右浮动

宇文曦
2023-03-14

所以我在一个网站上建立了一个包含搜索栏的navbar,同时还有一个分组按钮。它在桌面视图上运行良好,但当我缩小到移动视图时,站点会产生可折叠菜单,搜索栏会留在左侧,但按钮会浮到右侧。当我用它周围的input-group-btn类移除span时,就没有这个问题了。

<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中

共有1个答案

夹谷星剑
2023-03-14

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

 类似资料:
  • 我使用的是bootstrap 3,我有一个带有文本区和两个按钮的表单。我想要的是分组按钮与btn-group-vertical和textarea与按钮与input-group-button。 我的代码是: 这个选项按钮保持如此大。 第二种选择: 我想要像第二个选项,但没有灰框和这个边距。 有人能帮帮我吗?

  • 本文向大家介绍Bootstrap 4 Button .btn-outline-dark类,包括了Bootstrap 4 Button .btn-outline-dark类的使用技巧和注意事项,需要的朋友参考一下 在Bootstrap中使用.btn-outline-dark类在按钮上设置深色轮廓。 以下是带有深色轮廓的按钮的示例- 使用btn-outline-dark类将上述轮廓设置为按钮,如下所示

  • 本文向大家介绍Bootstrap navbar-btn类的用法,包括了Bootstrap navbar-btn类的用法的使用技巧和注意事项,需要的朋友参考一下 将.navbar-btn类的按钮添加到不位于<form>中的<button>元素中,以将其垂直放置在导航栏中。.navbar-btn可以用于<a>和<input>元素。 您可以尝试运行以下代码来实现navbar-btn类 示例

  • 这是一个增强的 HTML5 文件输入控件,是一个 Bootstrap 3.x 的扩展,实现文件上传预览,多文件上传等功能。

  • Bootstrap Rating Input 是 jQuery 的一个插件,它能简化 jQuery 和 Bootsrap 星星评分的产生,而且它只有 2kb。示例图如下:

  • 问题内容: 我有HTML: 和CSS: 在浏览器中,跨度以相反的顺序显示:导入导出设置。我可以仅通过更改CSS文件并保留HTML来更改顺序吗? 问题答案: 解决此问题的一般方法是反转HTML中右浮动元素的顺序,或将它们包装在包含元素中,然后将其浮动到右侧。