The Field container

Style the container you mount a Smart Field to, as if it were an <input> on your page. For example, to control padding and border on a Field, set these properties on the container. This is usually done by re-using the classes that you have applied to your DOM <input> elements. Example:

<style>
  .my-input {
    padding: 10px;
    border: 1px solid #ccc;
  }
</style>

<form>
  <div>
    <label>Name</label>
    <input class="my-input">
  </div>
  <div>
    <label>Card</label>
    <!-- Using the same "my-input" class on the -->
    <!-- regular input above and on this container. -->
    <div class="my-input" id="card-field"></div>
  </div>
</form>

After the Field is mounted, the .DlocalField class is added to the container.