You can download the latest /dist code directly from our GitHub repository v0.0.4-alpha (latest).

Don't forget to give us a ⭐ if you think FormaJS is worthwhile and we should continue improving on it.

Grouped Elements

Group elements within the same row by adding the additional data attribute data-group="" with the same value.

Send

CSS

.forma-wrap {
  display: flex;
}
.forma-wrap label {
  flex: 1 1;
  flex-direction: column;
}

Using a custom CSS stylesheet build on top of the forma-boilerplate.css template. Take a look at the code on our GitHub repository.

HTML

<form class="forma">
  <input data-label="Email Address" type="email" name="email-address" />
  <input data-label="First Name" data-group="full-name" type="text" name="first-name" />
  <input data-label="Last Name" data-group="full-name" type="text" name="last-name" />
  <textarea data-label="Message" rows="5" name="message"></textarea>
  <button type="submit">Send</button>
</form>

JavaScript

forma({
  auto: true
});