Destyling a Marketo form (for easier CSS restyling)
It's easier to customize a Marketo form if it's completely destyled to start. A float or margin-left that doesn't seem to respond to !important can drive a designer crazy, and time spent on CSS specificity & cascade behavior isn't well spent.
My li'l snippet for removing Marketo's built-in styles has seen a lot of use via the Community and a few code versions (now at the venerable v1.103) but it hasn't appeared on the blog before.
Here's a sample form with the Simple theme:
And here's that same form after running destyleMktoForm to reset it to browser defaults (check out the Times New Roman):
Let's dive into the destyleMktoForm function a bit, since I always insist on a teachable moment…