<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <form class="form-reseller"> <div class="well"> <div class="col-md-12"> <div class="form-group"> <label for="fullname">Nama Lengkap</label> <div class="form-item"> <input class="form-control" name="fullname" value="" size="60" maxlength="128" placeholder="(nama lengkap sesuai KTP)"> </div> </div> </div> <div class="col-md-12"> <div class="form-group"> <label for="nik" >Nomor KTP</label> <div class="form-item"> <input class="form-control" type="number" id="nik" name="nik" value="" step="1" placeholder="(wajib diisi)"> </div> </div> </div> <div class="col-md-12"> <div class="form-group"> <label for="province">Province</label> <div class="form-item"> <select class="select-dropdown" data-placeholder="Province" id=" province" name="province" data-select2-id="edit-province" tabindex="-1" aria-hidden="true"></select> <span class="select2 select2-container select2-container--default" dir="ltr" data-select2-id="1" style="width: auto;"> <span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-edit-province-container"><span class="select2-selection__rendered" id="select2-edit-province-container" role="textbox" aria-readonly="true"></span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span> </span> </div> </div> </div> <div class="col-md-12"> <div class="form-group"> <label for="city" >Kota/Kabupaten</label> <div class="form-item"> <select class="select-dropdown" id="city" name="city" tabindex="-1" aria-hidden="true" ></select> <span class="select2" dir="ltr" data-select2-id="2" style="width: auto;"> <span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-edit-city-container"><span class="select2-selection__rendered" id="select2-edit-city-container" role="textbox" aria-readonly="true"></span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span> </span> </div> </div> </div> <div class="col-md-12"> <div class="form-group"> <label for="sub_city">Kecamatan</label> <div class="form-item"> <select class="select-dropdown" data-placeholder="Kecamatan" id="sub-city" name="sub_city" data-select2-id="edit-sub-city" tabindex="-1" aria-hidden="true" > <option value="blue" data-select2-id="4">Blue</option> <option value="white">White</option> <option value="black">Black</option> <option value="other">Other</option> </select> <span class="select2 select2-container select2-container--default" dir="ltr" data-select2-id="3" style="width: 34.4444px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-edit-sub-city-container"><span class="select2-selection__rendered" id="select2-edit-sub-city-container" role="textbox" aria-readonly="true" title="Blue">Blue</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span> </div> </div> </div> <div class="col-md-12"> <div class="form-group"> <label for="phone">No. Handphone</label> <div class="form-item-phone"> <input class="form-control" type="tel" id="phone" name="phone" value="" size="30" maxlength="128" placeholder="(masukkan nomor handphone yang aktif)"> </div> </div> </div> </div> <div class="text-center"> <input class="cta cta-red form-submit" type="submit" id="edit-submit" name="op" value="Kirim"> </div> </form>

.well{ border-radius: 0; background-color: #fff; padding: 36px 48px; } label{ font-family: 'Helvetica-Bold'; font-weight: normal; font-size: 1.1rem; } .form-control{ height: 44px; border-color: #C5C5C5; } select{ border-radius: 2px; height: 44px; border-color: #C5C5C5; width:100%; }