Mixed Bootstrap form -
tried create bootstrap form has 2 input fields horizontal & multiple select. region 1 & region 2 along select should next input text field.. can please help, me region 1 & 2 coming below input field.
<div class="container"> <h2>bootstrap form</h2> <form role="form" class="form-horizontal"> <div class="form-group"> <div class="col-sm-5"><input type="text" class="form-control" id="inputid" placeholder="enter name"></div> </div> <div class="form-group"> <div class="col-sm-5"><input type="text" class="form-control" id="inputad" placeholder="ip address"></div> </div> <div class="form-group"> <div class="col-sm-5"> <label class="col-sm-12" for="selbuy">region 1</label> <div class="col-sm-6"> <select class="form-control" id="selbuy" multiple="multiple" size="6"> <option>california </option> <option>atlanta</option> </select> </div> </div> <div class="col-sm-5"> <label class="col-sm-12" for="selcsp">region 2</label> <div class="col-sm-6"> <select class="form-control" id="selcsp" multiple="multiple" size="6"> <option>google </option> <option>ibm</option> </select> </div> </div> </div> </form> <hr> </div>
i have setup fiddle this: http://jsfiddle.net/1wpjxp1e/
basically have wrapped input fields in wrapping div
<div class="col-sm-12">...</div>
and selectboxes too:
<div class="col-sm-12">...</div>
when i've done need make sure intended size kept changed the
<div class="col-sm-5">
to:
<div class="col-sm-12">
because needs full size. can see in fiddle both regions next input fields.
Comments
Post a Comment