Skip to main content
Dylan_Teo
Dylan_Teo
Level 2
November 20, 2018
Question

Anyone else face the issue of "ugly" Marketo forms on mobile?

  • November 20, 2018
  • 3 replies
  • 2629 views

As seen in the image attached, my Marketo form fields always seem out of proportion when seen on mobile. The reason why I cannot adjust the width of the global Marketo form fields is because they are of the right size when seen on desktop.

Does anyone know of a way to work around this?

Regards,

Dylan

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

SanfordWhiteman
SanfordWhiteman
Level 10
November 20, 2018

The reason why I cannot adjust the width of the global Marketo form fields is because they are of the right size when seen on desktop.

Well, you have to adjust them using responsive design. In fact the default styles don't keep the hard-coded width (although certainly they may not look too pretty on mobile, this is something you're overriding locally).

Dylan_Teo
Dylan_TeoAuthor
Level 2
November 20, 2018

Hi Sanford,

Thanks for your reply. When you say "adjust them using responsive design", is that something that can be done on Marketo? Or is that something I have to do on the landing page editor (which is Unbounce in my case)?

SanfordWhiteman
SanfordWhiteman
Level 10
November 20, 2018

Unbounce, eh?   Any specific reason why you aren't using an Unbounce form and posting it to the Marketo form acceptor?

Anyway -- this could be done using the Custom CSS option in Marketo Form Editor or via CSS on the Unbounce side. It's really the same concept, you need to un-override whatever styles you have that are breaking the regular Marketo layout, which as I said isn't particularly pretty but doesn't do what you show here.

F
Adobe Employee
falvaresAdobe Employee
Adobe Employee
November 20, 2018

Hey Dylan,

Adding to Sanford's comment, you would need to restyle your Marketo form on either Unbounce or within the CSS editor on the Form.

I would recommend reading through: Destyling a Marketo form (for easier CSS restyling)  which was posted by Sanford which has helped me a lot personally in enabling to style the forms without any overwritten code. Basic idea is to get rid of Marketo styles and then just add in the desired styling that is required on the landing page.

Hope this helps

Floyd

Casey_Grimes2
Casey_Grimes2
Level 10
November 20, 2018

Hi Dylan,

This can be tackled pretty easily with CSS: NormalizeMktoForms.css​

Terms & ConditionsAccessibility statement

Loading footer...