Ah I understand Horhe.
It will be a bit messy this way, but try this CSS.
.yikes-easy-mc-form-1 > label.EMAIL-label {
width: 30% !important;
}
#yikes-easy-mc-form-1-EMAIL {
font-size: 16px;
}
.yikes-easy-mc-form-1 > label.submit-button-inline-label {
width: 30% !important;
margin-left: 0;
}
Also, you currently have this CSS:
.yikes-mailchimp-container-1 .yikes-easy-mc-submit-button.yikes-easy-mc-submit-button-1 {
width: 50% !important;
margin-left: 25%;
margin-right: auto;
}
Change it to this:
.yikes-mailchimp-container-1 .yikes-easy-mc-submit-button.yikes-easy-mc-submit-button-1 {
width: 50% !important;
margin-left: 10px;
margin-right: auto;
}
Hope that makes sense!
All the best,
Kevin.
Hi Kevin, thanks for this but unfortunately it doesnt work. I removed all CSS and disabled inline option.
-
This reply was modified 8 years, 6 months ago by
Horhe.
I’ve cleared my cache but I am still seeing the form as inline. Do you have a way to clear the cache on your side?
Yup I see it now.
Here you go:
.yikes-easy-mc-form-1 label {
width: 60%;
margin-top: 10px;
display: inline-block;
}
.yikes-easy-mc-form-1 label > input {
font-size: 16px;
}
.yikes-easy-mc-submit-button-1 {
width: 20% !important;
display: inline-block !important;
}
Do I need to enable inline option again because Email input window is full width.
Some of the styles are being overwritten. Try changing .yikes-easy-mc-form-1 label to this:
.yikes-easy-mc-form-1 label {
width: 60% !important;
margin-top: 10px;
display: inline-block !important;
}
Wow now its almost perfect. Submit button is a bit smaller than label and on the mobile button is a bit offset. How to change button height to be the same as label?
Is it possible to have two rows form on mobile to avoid offset?
