PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Newbie needing help with styling forms

Gravity Support Forums » Plugin Support » Gravity Forms

  1. Studio610
    Member

    I've looked through the forum and can't seem to find what I'm looking for. I'm so new at this that I was wondering if anyone had any css styling code they could share that I could just paste into my theme. Once it's there, I can play with the settings but I really have no idea where to begin.

    http://gle.studio610.org/site-survey/

    Posted 12 years ago on Wednesday September 28, 2011 | Permalink

  2. Kevin Flahaut
    Administrator

    You'll need to be more specific about what you want. Do you want all of the fields to have the white background with squared corners, or do you want all of the fields to have the custom styling that's being inherited from your theme?

    We can probably point you in the right direction, but we need a little more guidance so we can help you out.

    Posted 12 years ago on Thursday September 29, 2011 | Permalink

  3. Kevin Flahaut
    Administrator

    Okay, having looked even more closely at your form.. this is going to be the easiest route to getting something consistent. The current theme sets some goofy background image that's simply not going to work for you very easily. You can try adding this to the end of your theme stylesheet.

    [css]
body .gform_wrapper input[type="text"],
body .gform_wrapper input[type="url"],
body .gform_wrapper input[type="email"],
body .gform_wrapper input[type="tel"],
body .gform_wrapper input[type="number"],
body .gform_wrapper input[type="password"],
body .gform_wrapper textarea,
body .gform_wrapper select {
	background-image: none !important;
	background-color: #EFEFEF;
	font-family: Georgia,"Times New Roman",Times,serif;
	font-style: italic;
	font-size: 1em !important;
	color: #909090;
	text-shadow: 0 1px 0 #FFFFFF;
	border: 1px solid #E6E6E6;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px
}

body .gform_wrapper input[type="text"],
body .gform_wrapper input[type="url"],
body .gform_wrapper input[type="email"],
body .gform_wrapper input[type="tel"],
body .gform_wrapper input[type="number"],
body .gform_wrapper input[type="password"],
body .gform_wrapper textarea {
	padding: 4px 0
}

body .gform_wrapper select {
	padding: 3px 0
}

body .gform_wrapper input[type=submit] {
	font-family: Georgia,"Times New Roman",Times,serif;
	font-style: italic;
	font-size: 1em !important;
	color: #909090;
	text-shadow: 0 1px 0 #FFFFFF;
	height: 2em;
	line-height: 2em;
	border: 1px solid #E6E6E6;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px
}

body .gform_wrapper input[type=image] {
	width: auto;
	height: auto;
	border: none !important;
	padding: 0 !important;
	background: none !important
}

    and here's my test screenshot: http://bit.ly/pDYsJz

    That should give you a good base to run with. Good luck with it.

    Posted 12 years ago on Thursday September 29, 2011 | Permalink

  4. Studio610
    Member

    That was perfect Kevin...exactly what I was looking for! Thanks so much for your quick response. I should be able to play with it from there but I'm not going to have to do much...thanks again!

    Posted 12 years ago on Thursday September 29, 2011 | Permalink

  5. Kevin Flahaut
    Administrator

    Wonderful. I'm very pleased I could help. Have fun and let us know if you need anything else.

    Posted 12 years ago on Thursday September 29, 2011 | Permalink

This topic has been resolved and has been closed to new replies.