Tagged: forms
The same form looks different on its own and on Enfold.
The difference is the gaps between the fields, it’s too wide on Enfold.
Can you use CSS to make the one on Enfold look more like the one on its own? Thanks.
Here’s the CSS in my email app:
.formkit-submit {font-size: 18px !important}
.formkit-submit:hover {background: #808080 !important}
.formkit-guarantee {line-height: 1.5em !important}
.formkit-checkbox {display: none !important}
.formkit-fields {margin: 0 auto !important}
.formkit-subheader {margin: 0 auto !important}
.formkit-subheader > p {margin: 0 auto !important}
.formkit-header > h2 {margin: 0 auto !important}
.formkit-header {margin: 0 0 10px 0 !important}
Hey Samuel,
Please try the following in Quick CSS under Enfold->General Styling:
.avia_ajax_form p {
margin: 0;
}
Best regards,
Rikard
Thanks!
Hi Samuel,
Please try adding this CSS code as well:
#top .formkit-header h2 {
line-height: 1.3;
}
#top .formkit-field fieldset {
margin-bottom: 0;
}
#top .formkit-field input.formkit-input {
font-size: 15px;
margin-bottom: 0;
padding: 12px;
}
Best regards,
Nikko