Form renders different on landing page

[Anonymous]

Has anyone else experienced the preview of a form rendering differently than the actual form when place on a landing page? It's extremely frustrating when I think it will show one way and it doesn't. Is there a setting that needs to be change? Is there a fix to this problem?

Form button looks like this in preview:                                            But looks like this on landing page

                             

Please help!!!! Thank you!

[Grégoire_Miche2]

Hi Sharnel,

Send us the URL of your LP.

I suspect there is a CSS stylesheet on you LP that changes the rendering of the form button.

-Greg

[Anonymous]

Grégoire Michel​ Sanford Whiteman​

Here's the URL : https://app-aba.marketo.com/lpeditor/devicePreview?p=3325&t=FOBDPHXxRUU,&m=585-LAK-159

[Grégoire_Miche2]

Hi Sharnel,

This is a Marketo internal URL. It supposes that we could connect to your instance

Send us the URL of the approved page, the one that your prospects could access.

-Greg

[Anonymous]

Sorry about that...I'm still somewhat of a novice. Here it is: http://info.cleansolar.com/Q-and-A-Landing-Page.html

[Grégoire_Miche2 · Accepted solution]

Hi Sharnel,

No problem

Indeed, there is a style in your landing page, (probably in the template) that modifies the button layout :

.button, button, input[type="reset"], input[type="submit"], input[type="button"] {

  background: #ffa200;

  border:7px solid #f9bd4f;

  -webkit-border-radius: 40px;

  -khtml-border-radius: 40px;

  -moz-border-radius: 40px;

  -ms-border-radius: 40px;

  -o-border-radius: 40px;

  border-radius: 40px;

  color:#FFFFFF !important;

  cursor:pointer;

  display:inline;

  font-size:16px !important;

  font-weight:bold;

  left:0px;

  padding:12px 20px !important;

  position:relative;

  text-shadow:1px 1px 1px #888;

  text-transform:uppercase;

  top:10px;

}

You will have to remove it or override it with a style that is specific to Marketo forms.

But in any case, the form rendering in the actual page is very different from your screen shots above.

-Greg

[Anonymous]

Oh I see. Thank you! That helps out a lot!

[SanfordWhiteman]

I assume you have CSS on the LP which (quite appropriately) affects the form elements. If you don't give us a URL there's nothing else for us to do.