-
Posts
-
I am using one of the Cognito sites forms on my home page http://www.businessmoneymatters.co.uk that is supposed to have a white background and black text but when I use those colours the text appears white. So I have had to temporarily change the colours to a red background
This is a response from their support
Nicholas (Cognito Forms)
Oct 2, 12:02 PM EDT
Hi,
The white color for the text looks to be coming form a theme or setting on your website that is bleeding over into the Cognito Form. The specific stile looks to be the following that is applying ‘color: currentColor;’ to the CSS class.
.boldgrid-section.bg-background-color :not(.btn):not(select):not(textarea):not(input):not(.wp-playlist), .boldgrid-section .bg-background-color :not(.btn):not(select):not(textarea):not(input):not(.wp-playlist), .boldgrid-section.dynamic-gridblock.bg-background-color :not(.btn):not(select):not(textarea):not(input):not(.wp-playlist), .boldgrid-section.dynamic-gridblock .bg-background-color :not(.btn):not(select):not(textarea):not(input):not(.wp-playlist)
I can provide you with CSS to correct this but it will make the text of the form always be that one color, and adjusting the color in the style editor will not effect the form, much like you have now. You can either update the CSS of your site to not blank apply the ‘color: currentColor;’ to all content or use CSS to target Cognito Forms text and change the color.
The code is not included by default as depending on the length of the form some users would want the end user to start at the top of the form and have the scroll up function.
Thank you,
Nicholas
Cognito Forms SupportPlease note that by the time you see this it may be different as I am going to try using it into a different block
Hello David,
As you noted, it looks like you may have resolved this issue already. I’m currently seeing the following CSS on your form:
.cognito .c-forms-form .c-editor, .cognito .c-forms-form .c-rating-scale-questions {
font-family: Arial,Helvetica,sans-serif;
font-weight: normal;
font-size: 0.8125em;
color: #000000; }This has the effect of making the text black (#000000) for your form. Since your iFrame was in a block with a black background, the Theme Framework works to ensure that your text has a contrast with the background color so that it’s readable.
Please let us know if you need any more help resolving this issue, we’re happy to help.
- The topic ‘Your theme is affecting text colour on iframes’ is closed to new replies.
