Bootstrap Form Validation

by Shuaib Khan

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/1000hz-bootstrap-validator/0.11.9/validator.min.js"></script>
<section class="footer-form padding-top-xl padding-bottom-xl" aria-label="Contact Form">
  <div class="wrapper">
    <div class="container">
      
      <div class="row">
        <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
		
          <form name="contentForm" enctype="multipart/form-data" method="" action="" role="form" data-toggle="validator" novalidate="true">
          <div class="form schedule-assessment">
            <div class="row margin-top-l">
            <div class="form-group col-md-6">
              <label for="full_name" class="">Full Name: </label>
              <input name="full_name" id="full_name" placeholder="Full name" type="text" value="" required="required" data-error="Please enter your full name.">
              <div class="help-block with-errors"></div>
            </div><!-- close col-->  
           
          </div>

        </div>
      </div>
    </div>
  </div>
</section>

CSS

@import url('https://fonts.googleapis.com/css?family=Montserrat|Open+Sans');
body {
    font-family: 'Open Sans', sans-serif;
    font-family: 'Montserrat', sans-serif;
}
input[type="text"], input[type="email"] {
    font-size: 1.6rem;
    color: #010100;
    width: 100%;
    line-height: 65px;
    padding-left: 3rem;
}
select {
    width: 100%;
    height: 65px;
    color: #010100;
    padding-left: 3rem;
}
.h1, h1 {
    font-size: 36px;
}
.h1, .h2, .h3, h1, h2, h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}
.text-white {
    color: #fff!important;
}
.font-w400 {
    font-weight: 400;
}
.padding-top-xl {
    padding-top: 5rem!important;
}
.padding-bottom-xl {
    padding-bottom: 5rem!important;
}
.margin-top-m {
    margin-top: 3rem!important;
}
.margin-bottom-m {
    margin-bottom: 3rem!important;
}
.section5 h2 {
    line-height: 35px;
}
.section5 p {
    font-size: 16px;
    line-height: 26px;
}
.has-error input[type="text"], .has-error input[type="email"], .has-error select {
    border: 1px solid #a94442;
}