We are having problems with alignment in Forms, and
it's a theme related issue.
The issue: When we put 2 elements (text fields,
check boxes etc.) in the same raw (beside each other) the theme pushes the
second element a few pix down (please see image1.jpg).
When we change the theme to other then TheFox the
issue get solved (please see image2.jpg).
This issue is present regardless of form-plugin used
(Have tried Ninja Forms and Contact Form 7).
This is because top padding is assigned to all form elements apart from the first element.
If you have a look at the source you should see the code refer to the first element as a separate class.
Simply update your child themes style.css with the first elements unique class and just adding the necessary padding.
Sorry the above isn\'t specific in which classes and how much padding as I remember resolving this issue last week with one of our plugins we use for forms (FormCraft).
Thank you for kind support! My knowledge is limited on how to proceed, could you please tell me where to find the first elements unique class? And how this uppdate in code might look like?
We are having problems with alignment in Forms, and it's a theme related issue.
The issue: When we put 2 elements (text fields, check boxes etc.) in the same raw (beside each other) the theme pushes the second element a few pix down (please see image1.jpg).
When we change the theme to other then TheFox the issue get solved (please see image2.jpg).
This issue is present regardless of form-plugin used (Have tried Ninja Forms and Contact Form 7).
Could you please help us solve this?
Hello Sam,
I am sorry but could you share us a link of your website so we can check the problem.
Regards
---------------------
Hosting we recommend ( Free SSL and CDN included in all plan ).
Speed up your site with Autoptimize
Test your site with GTmetrix and fix the issue to make it faster
How to Update your Theme
Hi Sam,
This is because top padding is assigned to all form elements apart from the first element.
If you have a look at the source you should see the code refer to the first element as a separate class.
Simply update your child themes style.css with the first elements unique class and just adding the necessary padding.
Sorry the above isn\'t specific in which classes and how much padding as I remember resolving this issue last week with one of our plugins we use for forms (FormCraft).
Kindest regards,
Samuel Rose.
Hi Sam,
Sorry as I am not Support and just a member of the public you will need to make it a public reply in order for me to see your reply.
Kindest regards,
Samuel Rose.
Hi Samuel,
Thank you for kind support! My knowledge is limited on how to proceed, could you please tell me where to find the first elements unique class? And how this uppdate in code might look like?
Hi Sam,
If you could give me a link to your site were the form is preferably.
Kindest regards,
Samuel Rose.
Of course, here you go: http://ion-silver.com/ny/af-uppgifter/ :-)
Thanks for your support buddy :)
Hi Sam,
In style.css in your child theme add the below:
form div:first-child{
margin-top: 15px;
}
.field-wrap, #ninja_forms_required_items{
margin-bottom: 0px !important;
}
Please remember this has to be added to your Child Themes style.css.
Please let me know how it goes.
Kindest regards,
Samuel Rose.
That worked perfectly Samuel, thank you very much for the help :-)
Kindest regards,
Sam
No problem at all.
Thank you for getting back to me.
Sam :)
Hello Sam and Samuel,
First Sam glad to see you have been able to fix the problem!
And Samuel thanks for helping other customer that\'s really kind from you!
Do not hesitate to contact us if you have other questions.
Regards
---------------------
Hosting we recommend ( Free SSL and CDN included in all plan ).
Speed up your site with Autoptimize
Test your site with GTmetrix and fix the issue to make it faster
How to Update your Theme