How to modify field label text color in custom CSS in Marketo Forms

[Anonymous]

No, I haven't touched the CSS since I implemented your earlier advice. But if I look at the 'd' or 'e' in the form labels compared to the rest of the site, as an example, the font looks different. 

Edit: I checked our test site on my other laptop -- a Macbook -- and the font in the form appears to be the same font as on the rest of the website. On both laptops I'm using Chrome. I suppose the font looks a little different depending on the screen resolution or other settings.

I'm still interested in figuring out how to modify the CSS so the field labels are in regular weight. 

I thought the Marketo forms would be responsive but I just discovered this isn't the case, so I also need to figure out how to make our forms responsive. I'll post a separate thread about that one. I hope it's not too difficult. Our site is responsive. 

Thanks again,
David

[Anonymous]

To fix your font-weight issue, here's the code:

.mktoForm .mktoRequiredField label.mktoLabel{
     font-weight: normal;
}

As far as responsive goes, Forms 2.0 are responsive, but the CSS code you have above declares fixed widths for the form and the fields. If you remove that code, your form should be responsive. Here's a screenshot of some tweaking I did in Chrome Inspector:

Desktop: http://cl.ly/image/1M3h1R2a2J0r
Tablet: http://cl.ly/image/1g3P42082r13
Mobile: http://cl.ly/image/032f33113b3u

You just need the coders to understand Marketo a little more 🙂

[Anonymous]

Thanks Jason. I see a few lines in the CSS for fixed widths. I deleted them and it threw off the length of one of the cells big-time. Am I only supposed to remove certain ones? 

[Anonymous]

It's not quite that easy...you'll need to replace most of the fixed widths with 100% !important declarations; since your form is in a responsive "container", you want it to fill that no matter the screen size.