ブートストラップで選択タグのサイズを制御する方法

Question

フォームの上部に2つのテキストボックスがあり、その下に2つの選択タグが続いています。以下はコードです。選択タグの幅を上記のテキストボックスと揃えるように、どのように変更できますか？

<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> 
 
\t <br> 
 
\t 
 
\t <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

あなたは正確な幅を知っている場合は、この

<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>