"Form Striped, Form Bordered, Form Horizontal "
Bootstrap 4.1.1 Snippet by hissan147

<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 ----------> <div class="container form"> <form method="POST" action="https://live2.dialer360.com/adminpanel/index.php/campaigns" accept-charset="UTF-8" class="form-horizontal form-bordered form-row-stripped"><input name="_token" type="hidden" value="VQn6grFUpDjvszIKeLygECNJwikaikMV1H6je3yQ"> <div class="form-body"> <div class="row"> <div class="col-12"> <div class="form-group row"> <label for="Name" class="col-lg-3 col-form-label">Input</label> <div class="col-lg-6"> <input class="form-control" type="text"> </div> </div> <div class="form-group row"> <label for="Name" class="col-lg-3 col-form-label">Select</label> <div class="col-lg-6"> <select class="form-control"> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select> </div> </div> <div class="form-group row"> <label for="Name" class="col-lg-3 col-form-label">Textarea</label> <div class="col-lg-6"> <textarea class="form-control"></textarea> </div> </div> </div> </div> <div class="form-actions"> <div class="row"> <div class="offset-lg-3 col-lg-9"> <button type="submit" class="btn btn-success">Submit</button> <button type="button" class="btn default">Cancel</button> </div> </div> </div> </form> </div>
.form { border: 1px solid #efefef; margin: 0 auto; padding: 0; } .form .form-body { margin: 0; padding: 0; } .form .form-bordered .form-group { margin: 0; border-bottom: 1px solid #efefef; } .form .form-bordered .form-group .col-form-label { padding-top: 20px; } .form .form-row-stripped .form-group:nth-child(even) { background-color: #fcfcfc; } .form-horizontal .col-form-label { padding-top: 7px; margin-bottom: 0; text-align: right; } .form .form-bordered .form-group > div { padding: 15px; border-left: 1px solid #efefef; } .form .form-actions { padding: 20px 10px; background-color: #f5f5f5; margin-top: 0; padding-left: 16px; padding-right: 16px; }

Related: See More


Questions / Comments: