Basic form

The template uses the components and validations of the bootstrap form. Also, the template includes the validation class .has-error.

By design .has-error class is applicable only for .form-group.

Example

Name Field name is required.

Email Field email is invalid.

Company (optional)

Message Maximum of 255 characters.

Source code

<div class="row">
  <div class="col col-md-4 col-lg-4">
    <div class="form-group has-error">
      <label>Name</label>
      <input type="text" class="form-control">
      <small class="text-danger">Field name is required.</small>
    </div>
  </div>
  <div class="col col-md-4 col-lg-4">
    <div class="form-group has-error">
      <label>Email</label>
      <input type="text" class="form-control">
      <small class="text-danger">Field email is invalid.</small>
    </div>
  </div>
  <div class="col col-md-4 col-lg-4">
    <div class="form-group">
      <label>
        Company <small class="text-secondary">(optional)</small>
      </label>
      <input type="text" class="form-control">
    </div>
  </div>
</div>
<div class="form-group">
  <label>Message</label>
  <textarea rows="3" class="form-control"></textarea>
  <small class="text-secondary">Maximum of 255 characters.</small>
</div>
<div class="form-group">
  <button class="btn btn-success">
    Send message
  </button>
</div>