Hi @ilan76
Hope you are doing fine!
I tested the code in my lab site and it is quite correct. It changes the font color and sets the background to transparent. It is possible some other code is overwriting the style on your site.
If it is possible for you to share a link to a staging site where the form is displayed, we could perform a further check on this request.
Kind regards
Luis
Thread Starter
ilan76
(@ilan76)
Hi, sorry it’s local.
Yes I know from dev tool it works but when adding to code snippets, or site advanced css – it’s not working. other css snippets work fine.
This specific css is ignored/not working.
Did you add in backend or just tested in dev tools?
Hi @ilan76
Yes, I just tested it again on my own test site:
– added it to custom CSS on site (via theme options)
– made sure that form’s appearance is set to “Material” design
– and tested
The CSS was applied correctly.
Most common reasons for CSS added this way not being applied are cache and/or CSS optimization. Also, some themes create CSS dynamically so it may needs to be “regenerated” (e.g. with Elementor sometimes there’s a need to use option in Tools to regenerate files) and then clear all cache, including any CSS optimization if there is such tool active on site.
Could you double-check those, please?
Kind regards,
Adam
Thread Starter
ilan76
(@ilan76)
Nope, not using any caching plugins or optimizations, only Blocksy theme.
ok this is weird, added to this selector as-well, and now it’s working:
.forminator-ui#forminator-module-1879.forminator-design--material .forminator-response-message, .forminator-ui#forminator-module-1879.forminator-design--material .forminator-response-message p {
font-size: 17px !important;
font-family: 'Montserrat' !important;
font-weight: 500 !important;
color: white !important;
background: transparent !important;
}
The thing is they need to be added both, if I remove the first code (initial selector) it doesn’t work.
Very strange…
-
This reply was modified 3 years, 2 months ago by
ilan76.
-
This reply was modified 3 years, 2 months ago by ilan76.
Hi @ilan76
You mean using it like this
.forminator-ui#forminator-module-1879
instead of this
#forminator-module-1879
right?
Your version would be a so-called “stronger” selector. I can’t replicate this on my end and I must say I can’t really explain specifically in relation to your site but one of the reasons for such cases happening is if there is similar CSS addressing the same selector(s) already existing on the site (e.g due to some other part of custom code) and if so – the “order” of CSS application would matter and using this code the way you came up with would help “overpower” the existing one.
But that’s just a “general” explanation. All in all, if this version works fine for you – it would be an acceptable solution.
Kind regards,
Adam
Hi @ilan76
I hope you are doing well and safe!
We haven’t heard from you in a while, I’ll mark this thread as resolved.
Feel free to let us know if you have any additional questions or problems.
Best Regards
Patrick Freitas
