html - 按钮对齐引导

Question

我想要一些关于我的 HTML 和 BOOTSTRAP 的小问题的帮助。

我想并排对齐两个单选按钮，但它不起作用。

这是我的代码：

<div class="form-group">
    <div class="col-xs-4 pr20">
        <h2 class="proxima-nova s18">Mode d'affichage : <h2>
    </div>
    <div class="col-xs-8 col-md-8">
        <span>
            <label class="radio-inline">
                <input type="radio" name="envois" id="oui" value="oui" checked />
                <h2 class="proxima-nova s18">Factures à régler <h2>
            </label>
            <label>
                <input type="radio" name="envois" id="non" value="non"/>
                <h2 class="proxima-nova s18">Toutes mes factures <h2>
            </label>
        </span>
    </div>
</div>

你给了我什么建议？

如果你有一个建议...

啤酒。

哦，是的，我纠正了一些错误：

<!------">Mode d'affichage ..." text------------------------------------------------------->
                        <div class="form-group">
                            <div class="col-xs-4 pr20">
                                <h2 class="proxima-nova s18">Mode d'affichage : </h2>

                            </div>
                            <div class="col-xs-8 col-md-8 " style="display:inline-block;">

                                <span>
                                    <label class="radio-inline">

                                        <input type="radio" name="envois" id="oui" value="oui" checked />
                                        <h2 class="proxima-nova s18">Factures à régler <h2>
                                    </label>

                                    <label class="radio-inline" style="display:inline-block;">

                                        <input type="radio" name="envois" id="non" value="non"/>
                                        <h2 class="proxima-nova s18">Toutes mes factures <h2>

                                    </label>
                                </span>

                            </div>
                        </div>

但是我还没有得到想要的结果。

我想做这样的事情：° FACTURES ° TOUTES...

如果你有什么建议...

啤酒。

Answer 1

您可以在代码笔http://codepen.io/CarraraWebsiteSolutions/pen/glxiy上将其分叉给您图标

Answer 2

我不确定引导程序是否有无线电内联，但如果有，两个元素都会有 class radio-inline，而不仅仅是一个。

否则，给它一个类，然后在那个类中拥有display:inline-block;它应该可以工作。