Bootstrap 向右拉仅在小宽度下有效

Question

我正在使用 Bootstrap 让一些文本和一个按钮出现在屏幕两侧的同一行上。我正在使用 pull-right 将按钮带到屏幕的右侧，但它仅在屏幕宽度较窄时有效。如果我把它变宽，按钮就会移动到文本旁边。 Here's a JSFiddle example及相关代码：

<body>
    <div class='container-fluid'>
        <form class="form-inline">
            <div class="form-group ">
                <label>Some Text</label>
                <button type="button" class="btn btn-primary pull-right">Some Button</button>
            </div>
        </form>
        <div><p>The button only appears on the right side of the window when the width is fairly narrow, even though it has the Bootstrap 'pull-right' class.</p></div>

    </div>
</body>

有没有办法让按钮在所有宽度上都靠右？抱歉，我对 Bootstrap 和 CSS 不是很好，所以我确信这是一件很容易的事情，我错过了。此外，就其价值而言，这是针对 Electron 应用程序的，因此它只需要在 Chrome.

中工作

谢谢。

Answer 1

那是因为它被包裹在 form group div 中，这只是较小视口上的全宽。您可以去掉 form group 并在 css.

中创建 div width:100%

Bootstrap 向右拉仅在小宽度下有效

Bootstrap pull-right only working at small width

html

css

css-float

twitter-bootstrap