"Bootstrap Contact Form"
Bootstrap 4.1.1 Snippet by kshiti06

<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 contact-form"> <div class="contact-image"> <img src="https://image.ibb.co/kUagtU/rocket_contact.png" alt="rocket_contact"/> </div> <form method="post"> <h3>Drop Us a Message</h3> <div class="row"> <div class="col-md-6"> <div class="form-group"> <input type="text" name="txtName" class="form-control" placeholder="Your Name *" value="" /> </div> <div class="form-group"> <input type="text" name="txtEmail" class="form-control" placeholder="Your Email *" value="" /> </div> <div class="form-group"> <input type="text" name="txtPhone" class="form-control" placeholder="Your Phone Number *" value="" /> </div> <div class="form-group"> <input type="submit" name="btnSubmit" class="btnContact" value="Send Message" /> </div> </div> <div class="col-md-6"> <div class="form-group"> <textarea name="txtMsg" class="form-control" placeholder="Your Message *" style="width: 100%; height: 150px;"></textarea> </div> </div> </div> </form> </div>
body{ background: -webkit-linear-gradient(left, #0072ff, #00c6ff); } .contact-form{ background: #fff; margin-top: 10%; margin-bottom: 5%; width: 70%; } .contact-form .form-control{ border-radius:1rem; } .contact-image{ text-align: center; } .contact-image img{ border-radius: 6rem; width: 11%; margin-top: -3%; transform: rotate(29deg); } .contact-form form{ padding: 14%; } .contact-form form .row{ margin-bottom: -7%; } .contact-form h3{ margin-bottom: 8%; margin-top: -10%; text-align: center; color: #0062cc; } .contact-form .btnContact { width: 50%; border: none; border-radius: 1rem; padding: 1.5%; background: #dc3545; font-weight: 600; color: #fff; cursor: pointer; } .btnContactSubmit { width: 50%; border-radius: 1rem; padding: 1.5%; color: #fff; background-color: #0062cc; border: none; cursor: pointer; }

Related: See More


Questions / Comments:

There are many other things that you should be wary of before your move and during the consultation. But by knowing EVOM in detail now, your move will be planned out perfectly. EVOM will help you in facilitating your move without any problems.

EVommovingapp () - 3 months ago - Reply 0


There are many other things that you should be wary of before your move and during the consultation. But by knowing EVOM in detail now, your move will be planned out perfectly. EVOM will help you in facilitating your move without any problems. If you need to consult us before your move, get in touch with us by visiting <a href="https://www.evom.io/"> apartment movers companies near me</a>

EVommovingapp () - 3 months ago - Reply 0


Where do I put my Email adresse so i can see the messages ?

https://www.evom.io/

EVommovingapp () - 3 months ago - Reply 0


Where do I put my Email adresse so i can see the messages ?

https://www.evom.io/

EVommovingapp () - 3 months ago - Reply 0


Where do I put my Email adresse so i can see the messages ?

Gsichtsbrezn0815 () - 2 years ago - Reply 0


e

xhat007 () - 4 months ago - Reply 0