Question

同样，问题最好由JSFiddle描述。

<div>
  <span style='cursor:pointer; float:right'>
                                    <div class="btn-group pull-right">
                                        <button id = 'majic' type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            <span class="glyphicon glyphicon-cog"></span>
  </button>
  <ul style='padding:10px' class="dropdown-menu">
    <li class="dropdown-submenu">
      <input id="full_package_filter" type="checkbox" name="vehicle" checked>Foo<span class='useful_stat'></span>
    </li>
    <li class="dropdown-submenu">
      <div class="container">
        <span>Number:</span>
        <span>
    <label class="checkbox-inline">
      <input type="checkbox" value=""><
    </label>
    <label class="checkbox-inline">
      <input type="checkbox" value="">=
    </label>
    <label class="checkbox-inline">
      <input type="checkbox" value="">>
    </label>
  </span>
        <span><input class="form-control input-sm" id="inputsm" type="text"></span>
      </div>

    </li>
  </ul>
</div>
</span>
</div>

我的目标是在单选按钮旁放置一个小输入框（在一行上）。我想，我必须使用Bootstrap网格系统，但我无法弄清楚如何。我所有的尝试都会产生疯狂有什么想法吗？

Answer 1

你在找这样的东西吗？

<div>
    <span style='cursor:pointer; float:right'>
        <div class="btn-group pull-right">
            <button id = 'majic' type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                <span class="glyphicon glyphicon-cog"></span>
            </button>
            <ul style='padding:10px' class="dropdown-menu">
                <li class="dropdown-submenu">
                    <input id="full_package_filter" type="checkbox" name="vehicle" checked>Foo<span class='useful_stat'></span>
                </li>
                <li class="dropdown-submenu">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-3">
                                <span>Number:</span>
                                <span>
                                    <label class="checkbox-inline">
                                        <input type="checkbox" value=""><
                                    </label>
                                    <label class="checkbox-inline">
                                        <input type="checkbox" value="">=
                                    </label>
                                    <label class="checkbox-inline">
                                        <input type="checkbox" value="">>
                                    </label>
                                </span>
                            </div>
                            <div class="col-md-3">
                                <span><input class="form-control input-sm" id="inputsm" type="text"></span>
                            </div>
                            <div class="col-md-6"></div>
                        </div>
                    </div>

                </li>
            </ul>
        </div>
    </span>
</div>

如果这有帮助，请告诉我。：）

在下拉菜单中的单选按钮内联窗体旁边放置引导输入

1 个答案: