Troubleshooting CSS for Marketo Form | Community
Skip to main content
Trina_Ng
Level 2
Feb 28, 2020 5:42 AM UTC
Solved

Troubleshooting CSS for Marketo Form

Hello everyone,

 

We're experiencing issues with a Marketo form on our website that doesn't seem to be listening to the CSS from the Marketo form or our CMS's CSS. It looks fine when it first loads, but the button moves out of place shortly after. We thought it was because we had two forms with different stylesheets on the page, so we removed one form, but it still didn't fix the problem. I would appreciate if anyone has any suggestions or solution to our problem? It's been over a month of reaching out to Marketo support with little help and we feel like we're losing our minds here.

 

 

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
SanfordWhiteman
SanfordWhitemanAccepted solution
Level 10
Feb 28, 2020 6:36 AM UTC

Cause is clear.

 

The Custom CSS for Form ID 1873 sets the .mktoButtonRow to {display:block} without properly scoping the rule to just that form. So it applies to all forms, including 1877 which you want to be inline.

 

Form 1873 should have:

 

 

#mktoForm_1873 .mktoButtonRow{ display: block !important; }

 

 

Form 1877 should have:

 

 

#mktoForm_1877 .mktoButtonRow{ display: inline !important; }

 

 

You also have a major mistake in the way you're loading your forms. Make sure they are all loading from launch.procurify.com. Mixing launch.procurify.com and app-ab01.marketo.com in your embeds causes hard-to-track submission errors.

3 replies

SanfordWhiteman
Level 10
Mar 3, 2020 6:24 AM UTC

@trina_ng please return to the thread and mark my answer as correct, thanks.

Translate
Trina_Ng
Trina_NgAuthor
Level 2
Mar 13, 2020 5:15 PM UTC

Thanks so much for troubleshooting that so quickly, @sanfordwhiteman ! You saved us yet again. 🎉

 

I went away on holiday shortly after and left this hanging for awhile. I just marked it as a solution. Thank you again! 🙏

Translate
SanfordWhiteman
SanfordWhitemanAccepted solution
Level 10
Feb 28, 2020 6:36 AM UTC

Cause is clear.

 

The Custom CSS for Form ID 1873 sets the .mktoButtonRow to {display:block} without properly scoping the rule to just that form. So it applies to all forms, including 1877 which you want to be inline.

 

Form 1873 should have:

 

 

#mktoForm_1873 .mktoButtonRow{ display: block !important; }

 

 

Form 1877 should have:

 

 

#mktoForm_1877 .mktoButtonRow{ display: inline !important; }

 

 

You also have a major mistake in the way you're loading your forms. Make sure they are all loading from launch.procurify.com. Mixing launch.procurify.com and app-ab01.marketo.com in your embeds causes hard-to-track submission errors.

Translate