Wufoo question

brandofamily

Why does my wufoo form get cropped around the edges when I install it on my SM site?
http://www.brandolinoimaging.com/Info-Pages/Contact-Bi

The form is supposed to have more padding around the edges and a thin border...:dunno

Oh, making the container box wider does not fix the issue...

thenickdude

Does it really get cropped? It just looks like it doesn't have any padding set on it (it looks like when the form uses its "embed" style, it explicitly removes all padding). Because the form is contained in an iframe, you can't style it with CSS on your SmugMug page, but you can style its container instead:

.wufoo-form-container {
	 padding-top:0em !important;
	 padding-left:1em !important;
	 padding-right:1em !important;
	 padding-bottom:1em !important;
	 background-color:black; /* Extend the wufoo background colour out into its container for the padding colour */
 }

brandofamily

Lamah wrote: »

Does it really get cropped? It just looks like it doesn't have any padding set on it (it looks like when the form uses its "embed" style, it explicitly removes all padding). Because the form is contained in an iframe, you can't style it with CSS on your SmugMug page, but you can style its container instead:

.wufoo-form-container {
     padding-top:0em !important;
     padding-left:1em !important;
     padding-right:1em !important;
     padding-bottom:1em !important;
     background-color:black; /* Extend the wufoo background colour out into its container for the padding colour */
 }

Oh, it's cropped. I have a double border set on the form on the Wufoo end and it does not show up on the SM end...

thenickdude

Wufoo automatically removes the border when the form is embedded on another page.

brandofamily

Lamah wrote: »

Wufoo automatically removes the border when the form is embedded on another page.

Not in OLD SM...

thenickdude

It's in Wufoo's CSS code when it's using the Embed style, it's not code that SmugMug has any control over.

brandofamily

Lamah wrote: »

It's in Wufoo's CSS code when it's using the Embed style, it's not code that SmugMug has any control over.

Gotcha... maybe I edited their code when I used it on OLD SM...

As for your code... I got it to work, but it pushes the form out of the container box. Will this cause any problems?
I had to add some blank divs on a stretchy page to get it centered...

thenickdude

Ah, true. You can stop that happening by changing the code to this:

.wufoo-form-container {
     padding-top:0em !important;
     padding-left:1em !important;
     padding-right:1em !important;
     padding-bottom:1em !important;
     background-color:black; /* Extend the wufoo background colour out into its container for the padding colour */
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}

brandofamily

Lamah wrote: »

Ah, true. You can stop that happening by changing the code to this:

.wufoo-form-container {
     padding-top:0em !important;
     padding-left:1em !important;
     padding-right:1em !important;
     padding-bottom:1em !important;
     background-color:black; /* Extend the wufoo background colour out into its container for the padding colour */
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}

Thanks!