Question

我想在表单中并排放置两个选项。我正在使用Bootstrap 3，但我无法正确对齐它们。

这是我的HTML代码：

    <form role="form">
        <div class="form-group">
            <div class="input-group date" id="datetimepicker1">
                <input type="text" class="form-control"/>
                <span class="input-group-addon"><span class="fa fa-calendar"></span></span>
            </div>
        </div>
        <div class="form-group">
            <div class="input-group">
                <input type="text" class="form-control"/>
                <span class="input-group-addon"><span class="fa fa-calendar"></span></span>
            </div>
        </div>
        <div class="form-group">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
            </select>
        </div>
        <div class="form-group">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
            </select>
        </div>
        <button type="submit" class="btn btn-primary btn-block te" >Prices &amp; Availability</button>
    </form>

Answer 1

使用此

jsfiddle http://jsfiddle.net/harshdand/e0fc1ucq/

<div class="row">
    <div class="col-sm-6">
        <div class="form-group">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
            </select>
        </div>
    </div>
    <div class="col-sm-6">
        <div class="form-group">
            <select class="form-control">
                <option>1</option>
                <option>2</option>
                <option>3</option>
            </select>
        </div>
    </div>
</div>

Answer 2

引导程序中的

class form-control具有block的显示值。给它一个类d-inline-block

    const upperCase = (str) => {

     let splitString = str.split(' ')
     let newArr = []


      for(let i=0; i<splitString.length; i++) {
        for (let j=0; j<splitString[i]; j++) {
          let capLet = splitString[i]
          capLet === splitString[0] ? capLet.toUpperCase() : null   // not sure what to do after this!
        }  
      }
    }

如何使用Bootstrap并排放置两个选项？

2 个答案: