인라인 양식 입력의 너비가 증가합니까?

Question

  <form class="form-inline"> 
       <div class="form-group"> 
        <label class="sr-only"></label> 
        <input class="form-control" type="text"/> 
       </div> 
       <div class="form-group"> 
        <label class="sr-only"></label> 
        <input class="form-control hello" type="text"/> 
       </div> 
       <div class="form-group"> 
        <label class="sr-only"></label> 
        <input class="form-control" type="text"/> 
       </div> 
       <input type="submit" class="btn" value="submit"/> 
      </form> 

중간 입력의 폭을 500px로 만들려면 어떻게해야합니까? col-xs-10을 연속으로 배치하려고 시도했지만 작동하지 않습니다. 여기에 a가있다 jsfiddle demo.

Answer 1

다음 CSS 규칙이 작동합니다 :

.form-inline .form-control.hello { 
    display: inline-block; 
    width:500px; 
} 

JS 바이올린 :http://jsfiddle.net/uvdU8/3/

Answer 2

아마도 가장 간단한 해결책은 style="width:500px;"을 입력에 추가하는 것이다.

업데이트 JSFiddle : http://jsfiddle.net/ThomasMcNaught/uvdU8/1/

당신이 다음 ID를 시도 CSS를 적용하려면.

input#width { 
    width: 500px; 
} 

데모 :http://jsfiddle.net/ThomasMcNaught/uvdU8/2/