Footer form « Gravity Support Forums

Footer form

Gravity Support Forums » Plugin Support » Gravity Forms

I would like to make the footer newsletter form smaller: http://kirstendyrum.com/
I to high now, I would like less space in the top of the form and in between the fields. I use Genesis from StudioPress and have this css stylesheet.

.gform_footer .button {
	background: #333333;
	color: #FFFFFF;
	font-size: 11px;
	font-family: Tahoma, Arial, Verdana;
	font-weight: bold;
	text-decoration: none;
	text-transform: uppercase;
	margin: 0;
	padding: 1px 5px 1px 5px;
	border: 1px solid #333333;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	}
.gform_footer .button:hover {
	background: #a3d7d7;
	border: 1px solid #7e7e7e;
	}
.gform_footer input.button {
	color: #FFFFFF !important;
	}
.gform_wrapper .gform_footer {
	border: none!important;
	}

Posted 13 years ago on Monday January 31, 2011 | Permalink

Kevin Flahaut
Administrator

You can try tweak the label margins and the margins on the form footer to tighten up the spacing. This snippet also removes the 20px left margin the form is inheriting from the theme style. Try adding this to the end your theme stylesheet.. it's targeted to just this one form ID so it wont affect your other forms.

body #gform_wrapper_8 .top_label .gfield_label {
    margin: 0 0 4px 0;
}

body #gform_wrapper_8 .ginput_complex label,
body #gform_wrapper_8 .gfield_time_hour label,
body #gform_wrapper_8 .gfield_time_minute label,
body #gform_wrapper_8 .gfield_date_month label,
body #gform_wrapper_8 .gfield_date_day label,
body #gform_wrapper_8 .gfield_date_year label,
body #gform_wrapper_8 .instruction {;
    margin: 3px 0 0 0;
}

body #gform_wrapper_8 .gform_footer {
    margin: 0;
    padding: 10px 0 0 0;
}

body #footer-widgeted #gform_wrapper_8 ul li {
    margin-left: 0;
}

test screenshot: http://grab.by/8GnC

Posted 13 years ago on Monday January 31, 2011 | Permalink