접힌 입력 창은 좁을 경우 브라우저의 폭> = 768px

CODE (bootstrap3 및 jQuery로)접힌 입력 창은 좁을 경우 브라우저의 폭> = 768px

<body> 

    <div class="navbar navbar-fixed-top" style="background-color: transparent; max-height: 50px;"> 
    <div class="container-fluid"> 
     <div class="row"> 
     <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10"> 

     </div> 

     <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2"> 
      <ul class="nav navbar-nav" style="margin-top: 0px; margin-bottom: 0px;"> 
      <li><a href="#" class="icon_navbar" data-toggle="collapse" data-target=".navbar-collapse1" style="padding: 15px;"><i class="glyphicon glyphicon-menu-down icon_navbar_color"></i></a></li> 
      </ul> 
     </div> 
     </div> 

     <div class="row"> 
     <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12"> 
      <div class="collapse navbar-collapse1" style=""> 
      <form class="navbar-form"> 
       <div class="input-group input-group-sm" style="max-width: 100%;"> 
       <input class="form-control" placeholder="Search" name="srch-term" id="srch-term" type="text"> 
       <div class="input-group-btn"> 
        <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search icon_navbar_color"></i></button> 
       </div> 
       </div> 
      </form> 
      </div> 
     </div> 
     </div> 

    </div> 
    </div> 

</body>

jsfiddle :https://jsfiddle.net/o2daoew5/

이 코드는 navbar하에 collapsed div를 개방 행한다.

브라우저의 너비가 768px보다 짧으면 입력 막대가 충분히 넓습니다.

브라우저의 너비가 768px 이상이므로 입력 막대가 짧아집니다.

질문 :

내가 브라우저의 폭이 입력 줄의 너비가 완전히 반응 만들고 싶어. 더 짧아지지 않습니다. 어떻게 해결할 수 있습니까? 귀하의 코멘트에 대한

출처

2017-12-09 H.fate

사용 클래스 form하지 navbar-form

<div class="collapse navbar-collapse1" style=""> 
    <form class="form"> 
     <div class="input-group input-group-sm" style="max-width: 100%;"> 
     <input class="form-control" placeholder="Search" name="srch-term" id="srch-term" type="text"> 
     <div class="input-group-btn"> 
      <button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search icon_navbar_color"></i></button> 
     </div> 
     </div> 
    </form> 
    </div>

출처

2017-12-10 14:37:53 touchingtwist

감사합니다 –

접힌 입력 창은 좁을 경우 브라우저의 폭> = 768px

답변

관련 문제