Tagged: CSS, Formidable
-
AuthorPosts
-
August 10, 2015 at 4:02 pm #485416
Hi,
There is no end for the CSS problems between Enfold and Formidable.
At this moment, I have the following problems: http://d.pr/i/19yoZ/40bsWcS5Could you please give me CSS code to fix these issues? The URL is in private
Many thanks
August 11, 2015 at 2:30 pm #485952Hey sitesme!
use this code for labels:
.frm_description { position: relative; top: -14px; }
spacing:
.frm_style_formidable-style.with_frm_style .form-field { margin-right: 8px; }
Best regards,
AndyAugust 11, 2015 at 2:35 pm #485953Hi Andy,
Unfortunately the spacing between fields didn’t change.August 11, 2015 at 3:04 pm #485978Hey!
I can’t see that you implemented the code. However, try to add an !important to it:
.frm_style_formidable-style.with_frm_style .form-field { margin-right: 8px !important; }
Make sure you implemented it correctly. Clear browser cache and hard refresh.
Best regards,
AndyAugust 11, 2015 at 3:18 pm #485982Hi Andy
I am sure I implemented the code and I just saw the changes now with your last code.
However, there are still problems with the two columns: http://d.pr/i/1jot8/1XkyVBdi and they are not properly aligned as the first / last name fields at the top.August 11, 2015 at 3:35 pm #486001Hey!
not sure what you want to achieve, as your screenshots look ok to me. However, try to add this code for “Price offer” field:
.frm_style_formidable-style.with_frm_style .form-field { margin-left: 3px; }
Regards,
AndyAugust 11, 2015 at 3:45 pm #486006Hi Andy,
The sshot I sent earlier is totally wrong. The columns are not aligned, please check the red arrow, where the “price” field should be moved to the top: http://d.pr/i/1hJ7P/16nMgEr8 like the email / mobile are aligned here side by side: http://d.pr/i/1dBT1/5X7D279i
Either way, I was able to fix this using the tags “frm_first_half” and “frm_last_half” instead of the regular “frm_half” for all of them. So, the alignment is now fixed.
The only problem remaining is the spacing between the field and the field description and the error message. They should all be below each other, with a single space. It seems they have double spacing now. Please check my yellow marks here: http://d.pr/i/EWBL/2w0e3Zdg – they should be all moved slightly above to make the desired “single spacing” instead of the “double spacing” as it looks now.
Many thanks.
- This reply was modified 9 years, 4 months ago by sitesme.
August 11, 2015 at 3:54 pm #486013Hey!
it looks like this for me when error message is activated:
(see private content)Which looks like you want it. Could you fix it?
Cheers!
Andy- This reply was modified 9 years, 4 months ago by Andy.
August 11, 2015 at 3:58 pm #486019Hi Andy,
Yes, I was able to fix the error messages spacing by using the following code:
.frm_error { margin-top: -10px !important; }
The only 2 remaining fixes now are as it follows: http://d.pr/i/12EFy/20OHMxwx
1) Decrease the spacing between the fields to about half of the actual size as mentioned by the yellow arrows
2) Decrease the gap between the description when they have multiple lines (also mentioned in the sshotMany thanks.
August 12, 2015 at 10:00 am #486350Hey!
1.) Seems you already managed it, right? Because now the fields seem to be exactly like in your screenshot.
2.) Use this code to control it:.frm_description { line-height: 18px; }
Please keep in mind that normally we don’t provide support for 3rd party plugins, as written in our support policy and you would need to contact plugin’s author. However, let us know if you are happy now.
Best regards,
AndyAugust 13, 2015 at 10:52 pm #487475Dear Andy,
Thank you for the update. Point 2 has been solved. Point 1 is still the same. Each row should be slightly closer to each other, i.e. decrease the gap between the first row of fields to the second row, and so on. Like the arrows show: http://d.pr/i/1jRpS/2G80mxTU
Any quick CSS code to fix this is highly appreciated.
Regarding the 3rd party plugin problem it is a very difficult call to make because if I install this plugin with other WP themes (with less CSS) it all works fine. The plugin even has a CSS configuration editor and works fine in some other themes. With Enfold, it is a disgrace. There are rules that Enfold overrides and causes all these sort of problems. If I contact the plugin developers they tell me to contact the theme developers, if I contact you here I get a similar reply: it is a very difficult situation to get this sorted in a good way. Perhaps the solution could be Enfold being compatible with the plugin since both are very powerful and well known theme / plugin respectively?
So far I had zero problems with Kriesi’s team. You are all very competent and usually we get a fix for almost all the issues straight away.
Many thanks once again.
August 14, 2015 at 11:19 am #487655Hey!
1.) Use this code:
.frm_style_formidable-style.with_frm_style .form-field { margin-bottom: 14px; }
and adjust as needed.
I have never heard about Formidable plugin before. However, if it’s well known as you say then you can make a feature request for Kriesi here: https://kriesi.at/support/enfold-feature-requests/. If lots of people vote for it, then he will make it fully compatible with Enfold in the future. Otherwise you need to contact plugin’s author for support or use another (compatible) plugin like contact form 7 for example.
Cheers!
AndyAugust 16, 2015 at 1:12 pm #488363Thank you Andy,
It worked with the following code:
.frm_style_formidable-style.with_frm_style .form-field { margin-bottom: 5px !important; }
I have also suggested the integration with Formidable. Contact form 7 (or any other contact form I used) has not the power of customisation that Formidable has. Their website for your reference is https://formidablepro.com/
Thank you for all help once again.
August 17, 2015 at 9:17 am #488700Hey!
glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.
Regards,
Andy -
AuthorPosts
- The topic ‘Formidable more CSS issues’ is closed to new replies.