Question

我在Bootstrap 3.3.5设置中有一些无线电按钮。如果检查某个单选按钮，则可以填充附加输入字段。因此我想把它放在那个单选按钮附近。有什么好办法呢？无论我将其放在label还是li中 - 它始终显示中断并打破无线电的内联显示。

        <ul class="list-inline">

            <li>
                <label class="radio-inline">
                    <input type="radio" name="rdoInp" id="rdoInp1" value="1"> Radio 1
                </label>
            </li><li>
                <label class="radio-inline">
                    <input type="radio" name="rdoInp" id="rdoInp6" value="6"> Radio 6
                </label>
            </li><li>
                <label class="radio-inline">
                    <input type="radio" name="rdoInp" id="rdoInp7" value="7"> Radio 7
                    <input type="text" name="txt1" class="form-control col-xs-1">
                </label>
            </li><li>
                <label class="radio-inline">
                    <input type="radio" name="rdoInp" id="rdoInp8" value="8"> Radio 8
                </label>
            </li>

        </ul>

与问题add text input to inline radio buttons中的回答不同，我处于.form-horizontal公式中。

小提琴：http://www.bootply.com/F57p30Eyo2

Answer 1

这看起来像是您如何在容器而不是列表上设置网格系统的问题。你有＆＃34; col-sm-4＆＃34;在包含div。如果您将其更改为＆＃34; col-sm-12＆＃34;它以内联方式显示文本输入字段。

该元素根本不适合所有其他元素作为这样一个窄列的一部分。例如，应用＆＃34;宽度：50px＆＃34;到文本字段也将它放在内联。

在Bootstrap无线电内联列表

1 个答案: