Display form on one line

For newsletter signups, it’s nice to display all fields (including submit) on a single line. This code lets you format WPForms this way.

In WPForms > Form > Settings > General, add a Form CSS class of “one line” (screenshot). The CSS will put all the fields into equal sized columns (you may need to tweak the CSS for your needs).

.wpforms-container {
	&.one-line {
		@include clearfix;

			@include media(">=tablet") {

			.wpforms-field-container {
				display: table;
				width: calc(100% - 110px);
				float: left;

				.wpforms-field {
					display: table-cell;
					padding-right: 16px;
					margin: 0;
				}
			}

			.wpforms-submit-container {
				float: right;
				width: 110px;
				clear: none;
				margin: 0;
			}
		}
	}

}