<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Comanda Actual</legend> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="selectbasic">a servir</label> <div class="col-md-5"> <select id="selectbasic" name="selectbasic" class="form-control"> <option value="0">¿Dónde será servido?</option> <option value="1">DELIVERY</option> <option value="2">MOSTRADOR</option> <option value="3">RESTO ROTI</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="eComanda">eComanda</label> <div class="col-md-4"> <input id="eComanda" name="eComanda" placeholder="numero electronico" class="form-control input-md" type="text"> </div> </div> <!-- Prepended text--> <div class="form-group"> <label class="col-md-4 control-label" for="prependedtext"> #</label> <div class="col-md-4"> <div class="input-group"> <span class="input-group-addon">N°</span> <input id="prependedtext" name="prependedtext" class="form-control" placeholder="00000000" required="" type="text"> </div> </div> </div> <!-- Appended Input--> <div class="form-group"> <label class="col-md-4 control-label" for="appendedtext">Nombre</label> <div class="col-md-5"> <div class="input-group"> <input id="appendedtext" name="appendedtext" class="form-control" placeholder="Nombre" required="" type="text"> <span class="input-group-addon">elegir</span> </div> <p class="help-block">¿Quién retira el producto?</p> </div> </div> <!-- Appended Input--> <div class="form-group"> <label class="col-md-4 control-label" for="direccion">Dirección</label> <div class="col-md-5"> <div class="input-group"> <input id="direccion" name="direccion" class="form-control" placeholder="Rufino Ortega 515" required="" type="text"> <span class="input-group-addon">Mostarr</span> </div> <p class="help-block">¿Dónde se entrega el pedido?</p> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="telefono">Tel</label> <div class="col-md-4"> <input id="telefono" name="telefono" placeholder="2604XXXXXX" class="form-control input-md" type="text"> <span class="help-block">¿Dónde llamamos?</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="cantidadactual">Cantidad</label> <div class="col-md-4"> <input id="cantidadactual" name="cantidadactual" placeholder="1" class="form-control input-md" required="" type="text"> <span class="help-block">¿Cuántas unidades ordenará?</span> </div> </div> <!-- Button (Double) --> <div class="form-group"> <label class="col-md-4 control-label" for="btn_borrar">Acciones</label> <div class="col-md-8"> <button id="btn_borrar" name="btn_borrar" class="btn btn-danger">Borrar</button> <button id="btn_agregar_otro" name="btn_agregar_otro" class="btn btn-success">Agregar Otro</button> </div> </div> <!-- Button --> <div class="form-group"> <label class="col-md-4 control-label" for="btn_termianr_comanda">Terminar</label> <div class="col-md-4"> <button id="btn_termianr_comanda" name="btn_termianr_comanda" class="btn btn-primary">Confirmar la Comanda</button> </div> </div> </fieldset> </form>