javascript - how to align label & date time picker in a row -
i have tried keep controls in same line, not falling 1 line.
<div class="form-group"> <div class="col-sm-3" style="float:left" ;> <div class="form-group"> starts on : <div class='input-group date' id='datetimepicker1'> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> <div class="col-sm-9"> <label>ends</label> <div class="form-group"> <label class="radio-inline"> <input type="radio" name="optradio">never</label> <label class="radio-inline"><input type="radio" name="optradio">after</label> <input style="height:30px;width:50px" type="text" name="fname"> occurances <label class="radio-inline"> <input type="radio" name="optradio">on </label> <div class='input-group date' id='datetimepicker1' style="width:150px;"> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> </div>
i have show datetime picker right side of on radio button.
i hope u r looking for
code
<div class="form-group"> <div class="col-sm-3" style="float:left" ;> <div class="form-group"> starts on : <div class='input-group date' id='datetimepicker1'> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> <div class="col-sm-9"> <label>ends</label> <div class="form-group"> <label class="radio-inline"> <input type="radio" name="optradio">never</label> <label class="radio-inline"><input type="radio" name="optradio">after</label> <input style="height:30px;width:50px" type="text" name="fname"> occurances <label class="radio-inline"> <input type="radio" name="optradio">on </label> <div class='input-group date' id='datetimepicker1' style="width:150px;"> <input type='text' class="form-control" /> <span class="input-group-addon"> <span class="glyphicon glyphicon-calendar"></span> </span> </div> </div> </div> </div>
working fiddle
make sure u link bootstrap in ur project properly
Comments
Post a Comment