如何使用bootrap在单行中使用3个选择框

Question

我正在尝试创建一个与此类似的表单。 一行中的3个输入字段，不使用左侧的标签。 其实我想使用右侧的标签。

我无法使用普通的<label></label>标签来获取右侧的标签。没有工作。

我的解决方案是使用带内联输入的span。

我试图用表单组来做到这一点。但结果非常好。也许你可以帮助我。

<div class="form-group">
    <label class="col-md-3 control-label">Aktivite Süresi</label>
    <div class="col-md-4">
        <div class="form-group row">
            <div class="col-md-3">
                <select class="form-control input-xsmall input-inline">
                    <option>0</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                    <option>6</option>
                    <option>7</option>
                    <option>8</option>
                </select>
                <span class="inline-help">gün</span>

            </div>
            <div class="col-md-3">

                <select class="form-control input-xsmall input-inline">
                    <option>0</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                    <option>6</option>
                    <option>7</option>
                    <option>8</option>
                </select>
                <span class="inline-help">saat</span>


            </div>

            <div class="col-md-3">

                <select class="form-control input-xsmall input-inline">
                    <option>0</option>
                    <option>1</option>
                    <option>2</option>
                    <option>3</option>
                    <option>4</option>
                    <option>5</option>
                    <option>6</option>
                    <option>7</option>
                    <option>8</option>
                </select>
                <span class="inline-help">dakika</span>

            </div>
        </div>
    </div>
</div>

结果出现了

Answer 1

可以添加class =“col-md-4”而不是col-md-3

如果内部子项仍无效，则可以将父类从col-md-4增加到col-md-8。

总计应为12.因此，您可以将值扩展到col-md-12 max。

Answer 2

我找到了两个解决方案

解决方案1：

<div class="form-group">
                                            <label class="col-md-3 control-label">Son rezervasyon zamanı 1</label>
                                            <div class="col-md-4">
                                                <div class="form-group row">

                                                    <div class="col-md-4">

                                                        <select class="form-control input-xsmall input-inline">
                                                            <option>0</option>
                                                            <option>1</option>
                                                            <option>2</option>
                                                            <option>3</option>
                                                            <option>4</option>
                                                            <option>5</option>
                                                            <option>6</option>
                                                            <option>7</option>
                                                            <option>8</option>
                                                        </select>
                                                        <span class="inline-help">gün</span>

                                                    </div>


                                                    <div class="col-md-4">

                                                        <select class="form-control input-xsmall input-inline">
                                                            <option>0</option>
                                                            <option>1</option>
                                                            <option>2</option>
                                                            <option>3</option>
                                                            <option>4</option>
                                                            <option>5</option>
                                                            <option>6</option>
                                                            <option>7</option>
                                                            <option>8</option>
                                                        </select>
                                                        <span class="inline-help">saat</span>


                                                    </div>


                                                    <div class="col-md-4">

                                                        <select class="form-control input-xsmall input-inline">
                                                            <option>0</option>
                                                            <option>1</option>
                                                            <option>2</option>
                                                            <option>3</option>
                                                            <option>4</option>
                                                            <option>5</option>
                                                            <option>6</option>
                                                            <option>7</option>
                                                            <option>8</option>
                                                        </select>
                                                        <span class="inline-help">dakika</span>

                                                    </div>





                                                </div>
                                            </div>
                                        </div>

解决方案2：

<div class="form-group">
                                            <label class="col-md-3 control-label">Son rezervasyon zamanı 2</label>
                                            <div class="col-md-4">

                                                <select class="form-control input-xsmall input-inline">
                                                    <option>0</option>
                                                    <option>1</option>
                                                    <option>2</option>
                                                    <option>3</option>
                                                    <option>4</option>
                                                    <option>5</option>
                                                    <option>6</option>
                                                    <option>7</option>
                                                    <option>8</option>
                                                </select>
                                                <span class="inline-help">gün</span>

                                                <select class="form-control input-xsmall input-inline">
                                                    <option>0</option>
                                                    <option>1</option>
                                                    <option>2</option>
                                                    <option>3</option>
                                                    <option>4</option>
                                                    <option>5</option>
                                                    <option>6</option>
                                                    <option>7</option>
                                                    <option>8</option>
                                                </select>
                                                <span class="inline-help">saat</span>

                                                <select class="form-control input-xsmall input-inline">
                                                    <option>0</option>
                                                    <option>1</option>
                                                    <option>2</option>
                                                    <option>3</option>
                                                    <option>4</option>
                                                    <option>5</option>
                                                    <option>6</option>
                                                    <option>7</option>
                                                    <option>8</option>
                                                </select>
                                                <span class="inline-help">dakika</span>
                                            </div>
                                        </div>