html - Bootstrap inline form's submit button not in the same line -


i tried use bootstrap's inline form oddly submit button can't put on same line other input items. had been searching solutions didn't find 1 yet.

enter image description here

here html code:

<form class="form-inline" role="form" method="post" action=""> <div class="form-group">     <input type="text" class="input-small" id="startdate" placeholder="start date" name="startdate"> </div> <div class="form-group">     <input type="text" class="input-small" id="enddate" placeholder="end date" name="enddate"> </div> <div class="form-group">    <input type="text" class="input-small"" id="number" placeholder="number" name="number"> </div> <div class="form-group">     status: <select class="selectpicker" id="status" name="status" >           <option value="all">all</option>           <option value="successful">successful</option>           <option value="unsuccessful">unsuccessful</option>     </select>    </div>     <div class="form-group">     direction: <select class="selectpicker" id="direction" name="direction">           <option value="all">all</option>           <option value="in">in</option>           <option value="out">out</option>     </select>     </div>     <button type="submit" class="btn btn-success" id="submit" name="submit"/>submit</button>     </form> 

can me inline submit button other items? lot!

put button inside <div class="form-group">

<form class="form-inline" role="form" method="post" action=""> <div class="form-group">     <input type="text" class="input-small" id="startdate" placeholder="start date" name="startdate"> </div> <div class="form-group">     <input type="text" class="input-small" id="enddate" placeholder="end date" name="enddate"> </div> <div class="form-group">    <input type="text" class="input-small"" id="number" placeholder="number" name="number"> </div> <div class="form-group">     status: <select class="selectpicker" id="status" name="status" >           <option value="all">all</option>           <option value="successful">successful</option>           <option value="unsuccessful">unsuccessful</option>     </select> </div> <div class="form-group">     direction: <select class="selectpicker" id="direction" name="direction">           <option value="all">all</option>           <option value="in">in</option>           <option value="out">out</option>     </select> </div> <div class="form-group">     <button type="submit" class="btn btn-success" id="submit" name="submit"/>submit</button> </div> </form> 

Comments

Popular posts from this blog

c++ - How to add Crypto++ library to Qt project -

jQuery Mobile app not scrolling in Firefox -

How to use vim as editor in Matlab GUI -