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.