如何控制bootstrap中select标签的大小

Question

我有一个表单，顶部有两个文本框，后面是两个选择标记。下面是代码。如何修改选择标记的宽度，使它们与上面的文本框对齐。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<form class="form-inline">
  <div class="form-group">
    <label class="sr-only" for="Title">Title</label>
                <input type="text" class="form-control" name='p_Title' value='' ng-model="reports.title" class='requiredAttribute' placeholder="Title">
  </div>
  <div class="form-group">
    <label class="sr-only" for="subTitle">Sub Title</label>
                <input type="text" class="form-control" name='p_SubTitle' value='' ng-model="reports.subtitle" class='requiredAttribute' placeholder="Sub Title">
  </div>  </form>
	<br>
	
	<form class="form-inline">
  <div class="form-group">
    <select class="form-control" name="category">
                <option value=""></option>
                <option value="0">select1</option>
                <option value="1">select2</option>
                <option value="2">select3</option>
            </select>      
  </div>
  <div class="form-group">
  <select class="form-control" name="category">
                <option value=""></option>
                <option value="0">select1</option>
                <option value="1">select2</option>
                <option value="2">select3</option>
            </select>      
  </div>
  </form>

Answer 1

用Bootstrap's Grid System

包裹它们

与此相关的内容

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<form class="form-inline">
  <div class="row">
    <div class="col-sm-6">
      <div class="form-group">


        <label class="sr-only" for="Title">Title</label>
        <input type="text" class="form-control" name='p_Title' value='' ng-model="reports.title" class='requiredAttribute' placeholder="Title">
      </div>
    </div>
    <div class="col-sm-6">
      <div class="form-group">
        <label class="sr-only" for="subTitle">Sub Title</label>
        <input type="text" class="form-control" name='p_SubTitle' value='' ng-model="reports.subtitle" class='requiredAttribute' placeholder="Sub Title">
      </div>
    </div>
  </div>
</form>
<br>

<form class="form-inline">
  <div class="row">
    <div class="col-sm-6">
      <div class="form-group">
        <select class="form-control" name="category">
          <option value=""></option>
          <option value="0">select1</option>
          <option value="1">select2</option>
          <option value="2">select3</option>
        </select>      
      </div>
    </div>
    <div class="col-sm-6">
      <div class="form-group">
        <select class="form-control" name="category">
          <option value=""></option>
          <option value="0">select1</option>
          <option value="1">select2</option>
          <option value="2">select3</option>
        </select>      
      </div>
    </div>
    </form>