First & Last Name style/position problems

Gravity Support Forums » Plugin Support » Gravity Forms

Hi,

Sorry to ask for help, but I am having difficulty with the positioning of the First & Last Name sub labels.

I've looked through the forums and docs, and been using firebug on my other forms to work out why they are right aligned but can't fix it.

You can view the form here: http://www.aspect-emailmarketing.co.uk/find-out-more-form-2/

and here is the CSS for it.

.gform_wrapper ul { margin:10px 0 0 0; padding:0!important; line-height:normal!important; list-style: none; }
.gform_wrapper form {background:none repeat scroll 0 0 #F4F5F6; border:1px solid #E5E5E5; font-weight:normal; margin-left:8px; padding:16px 16px 40px; font-family:"Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif; color:#777; }
.gform_wrapper { padding:0; }
.gform_wrapper input[type=text],.gform_wrapper input[type=select].gform_wrapper input[type=search],.gform_wrapper input[type=tel],.gform_wrapper input[type=url],.gform_wrapper input[type=email],.gform_wrapper input[type=datetime],.gform_wrapper input[type=date],.gform_wrapper input[type=month],.gform_wrapper input[type=week],.gform_wrapper input[type=time],.gform_wrapper input[type=datetime-local],.gform_wrapper input[type=number],.gform_wrapper input[type=range],.gform_wrapper input[type=color],.gform_wrapper textarea { background:none repeat scroll 0 0 #FBFBFB; border:1px solid #E5E5E5; font-size:12px; margin-bottom:16px; margin-right:6px; margin-top:2px; padding:3px; color:#555; }
.gform_wrapper label { font:13px "Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif; font-weight:normal!important; color:#777; }
.gform_wrapper .gform_footer input.button,.gform_wrapper .gform_footer input[type=submit] {  color:#FFFFFF; font-weight:bold; text-shadow:0 -1px 0 rgba(0,0,0,0.3); -moz-border-radius:11px; -webkit-border-radius:11px; border-radius:11px; -khtml-border-radius:11px; border:1px solid #298CBA; cursor:pointer; font-family:"Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif; font-size:12px; margin-top:-3px; padding:3px 10px; text-decoration:none; }
.gform_wrapper .gsection .gfield_label,.gform_wrapper h2.gsection_title,.gform_wrapper h3.gform_title { font-family:"Myriad Pro Cond", "Trebuchet MS", "Arial"; font-size:25px; color:#2c2c2c; margin-top: 5px;}
.gform_wrapper .ginput_complex input,.gform_wrapper .gfield_time_hour input,.gform_wrapper .gfield_time_minute input,.gform_wrapper .gfield_date_month input,.gform_wrapper .gfield_date_day input,.gform_wrapper .gfield_date_year input,.gform_wrapper .instruction { margin-bottom:4px!important; }
.gform_wrapper span.gform_description { line-height:150%; }
.gfield_required {color: #CA0000;}
#gforms_confirmation_message{background-color:#A1D193; border:1px solid #84BA42; margin-top:10px; margin-bottom:10px; padding:20px 0; font-size:14px; color:#252525; text-align:center}
.gform_wrapper .gfield_error{ background-color:#FFDFDF!important;  margin-top:4px!important;  margin-bottom:6px;  padding:6px 6px 4px 6px!important; border:1px dotted #C89797}

All help greatly appreciated.

Posted 13 years ago on Friday July 30, 2010 | Permalink

Carl Hancock
Administrator

I don't see the Gravity Forms CSS call present on the page which means it isn't getting all the necessary formatting styles. The page doesn't have the wp_head() function call in the header.php file.

Gravity Forms uses the wp_head() function call to be able to output the necessary CSS and JS in the HEAD area of the page. But this page looks unique... does it even use the header.php file?

Posted 13 years ago on Friday July 30, 2010 | Permalink

Justin Walmsley
Member

Hi Carl,

This was the plain page created in the Modal window tutorial:
http://www.gravityhelp.com/creating-a-modal-form-with-gravity-forms-and-fancybox/

it has the <?php wp_head(); ?> in the page, but i have had to add the link to the custom stylesheet in the page.

here is the page code

<?php
 /*
 Template Name: plain page
 */
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
  <meta name="MSSmartTagsPreventParsing" content="true" />
  <meta http-equiv="Imagetoolbar" content="No" />
<link href="<?php bloginfo('template_directory'); ?>/form.css" rel="stylesheet" type="text/css" />
  <title>My Form Title</title>
  <style type="text/css">
  	body {font-size:13px;}
  </style>

  <?php wp_head(); ?>
  </head>
<body>
  <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  <?php the_content('read more'); ?>
  <?php endwhile; endif; ?>
  <?php wp_footer(); ?>
</body>
</html>

Gravity forms is not outputting it's own css for the page.

Hmmm?

Posted 13 years ago on Friday July 30, 2010 | Permalink

Carl Hancock
Administrator

Do you have CSS output turned off in your Gravity Forms settings (Forms > Settings)?

Posted 13 years ago on Friday July 30, 2010 | Permalink