The Single Line Elementor Forms code snippet helps to style forms where all elements (fields, buttons, etc.) are on one line.
This overall snippet also includes a bonus snippet for fixing field border-radius issues that comes with Elementor Pro forms.
The form at the bottom of Starter Site 4’s Blog Page, is an example of this type of form.
/**** ELEMENTOR FORMS ****/
/** FORM FIELD RADIUS AND PADDING FIX **/
.elementor-field-group:not(.elementor-field-type-upload) .elementor-field:not(.elementor-select-wrapper) {
border-radius: 25px !important;
}
/** SINGLE LINE FORMS **/
#single-line-form-button {
margin-left: -50px;
z-index: 100;
}
@media only screen and (max-width: 768px) {
#single-line-form-button {
margin-left: -45px;
}
}
@media only screen and (max-width: 414px) {
#single-line-form-button {
margin-left: 0px;
margin-top: 5px;
}
}
@media only screen and (max-width: 414px) {
.elementor-widget-form .elementor-field-group .elementor-field {
text-align: center !important;
}
}