I'm trying to fix a CSS bug on my form. When the form first loads, everything looks fine. We have two hidden checkboxes that appear when a certain option in a dropdown is selected. However, the text in those checkboxes is in a <span> with style="color: #ffffff", so against the white background, they don't appear to be there. Here's what I know:
What is going on? How can I remove that inline style so the text is not white and invisible? I think somewhere some JavaScript is running to inject that text and change the color to white. But where would that be?
This is my first time posting to Marketo Nation and I only started using Marketo a week or two ago so let me know if I should make changes to my question or setup. Thanks!
Solved! Go to Solution.
The inline #ffffff text color is right in the form descriptor (it's not coming from anywhere else).
Make sure you edit the label HTML in the Visibility Rules dialog -- the so-called "alternate label" -- as well as in the default Form Editor view. You may need to recreate the VR for this to take effect.
You must provide a URL.
Be aware that if the form is on a Marketo-hosted LP, you must reapprove the form and reapprove the LP for the changes to be public-facing.
Also, when you talk about "changing" these various styles, you need to be specific about how you did so (CSS selector, inline style, etc.).
I think somewhere some JavaScript is running to inject that text and change the color to white.
Not unless you've written it.
The form is on this page (click on Request Demo, select a European country like Spain to see the checkbox labels). Note: the current fix for this is selecting the class and using !important, but if you inspect the label, you'll see that it still has style="color: #ffffff" applied.
The form is embedded, not on a landing page. I've encountered that approval chain obstacle before though.
I attempted to change the styles by using the rich text editor for the field. However, even when I changed the text content, this had no effect on the output on the Marketo form preview. In fact, even when I switched to a different form element, the label stayed exactly the same in the preview (despite showing the change in the editor).
Unfortunately I inherited an old and expansive Marketo application suite so it's quite possible someone wrote a script years ago that's interfering with this form now. I just have no idea where it would be hosted.
Learning Marketo has been very tough, but now I can thank you for all your clarifying answers in these forums!
The inline #ffffff text color is right in the form descriptor (it's not coming from anywhere else).
Make sure you edit the label HTML in the Visibility Rules dialog -- the so-called "alternate label" -- as well as in the default Form Editor view. You may need to recreate the VR for this to take effect.