Is a Marketo form intuitive to mobile, tablet and desktop?

The answer is "somewhat responsive." It depends on which widgets (input types) you're using and where your breakpoints are: if a form is never wider than your smallest breakpoint then you have a lot less to worry about from the form itself, but of course it matters where you're placing it in the flow. A single element on a page can't make the surrounding content responsive, after all.

The best thing is to try it using your (desktop) browser's mobile/small screen emulation, like you must do with the page itself.

Hi Natalie,

On top of Sanford's answer, you can make it fully responsive with a little CSS in your template or on your web site (for embedded forms).

-Greg

I'll pile on a bit here...

Especially if you are hosting the form on an external website, you might be seeing that the Marketo form styles are pushing thru "in place of" your website's form styles. This is usually because your website form styles are loaded into the document earlier than the Marketo form styles and/or because the styles being brought in from Marketo are more local or 'specific'.

In my experience, most of the things "out of the box" with forms aren't really responsive, they're usually fixed widths that get rendered as inline styles on the form elements (and that's usually why they "override" your website/template styles).

In one way or another, you'll likely need to add some responsive or fluid widths to your form and a few of the elements, at least.

There are a ton of ways to go about this, but here's a quick look at one approach:

In most cases, you can push any of the fixed width elements to "full-width" by forcing their width to 100% - here's an example of some CSS that would make the form itself full-width (fill the container it is placed into).

form.mktoForm {width:100% !important;}

Here's a snapshot of the code-view to get a sense of the form's architecture.

The green boxes are things that'll I'll normally enforce the 100% rule for (above). You might think to include select and textarea inputs as well.

You'll also notice the width (red underlines) that get written to the inline styles for the elements (the input and label widths are set in the Form Editor).