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.

Confirm Password Field not styled or aligned?

  1. Hi Guys,

    sorry, styling seems to be an ongoing issue for me. Maybe it's the way my developer is styling the forms???

    Anyway,

    I'm using the AMAZING User Registration add on (GF 1.5.2.3 & User Reg 1.2) but i cannot get the confirm password to display properly.

    I have been through all the posts i can find and have been playing around with the different ginput_right and ginput_complex classes but cannot get it working.

    Here is the link: http://bit.ly/lR3AbQ

    Any and all help would be massively appreciated.

    By the way, have you guys thought about supplying some basic "Form Themes" that we could then change easily and add into our own CSS files? Just a thought?

    Posted 12 years ago on Sunday June 12, 2011 | Permalink
  2. Sorry, I don't see a form on the page you linked to.

    Also, have you checked the layout in the preview window? If it works properly in the preview and not you theme, then it's your theme styles that are causing the problems.. just a quick way to know where to start debugging.

    Posted 12 years ago on Sunday June 12, 2011 | Permalink
  3. Hi Kevin,

    I thought I was the only one working on a Sunday!?

    Sorry a plugin I installed knocked out the form shortcode, i have just deactivated the plugin (Shortcodes Ultimate for your ref) and the form is now displaying again.

    Here is the link: http://bit.ly/lR3AbQ

    I will check the preview now, but i am confident it is my theme styling that is screwing the layout.

    Thanks for looking into this, you guys offer AMAZING service!

    Posted 12 years ago on Sunday June 12, 2011 | Permalink
  4. Yeah, I'm a geek.. have to check in on Sundays as well and do what I can.

    Yeah, your theme's style.css (line 911) has a rule that limits the "ginput_container" width to 235px, this is causing the wrapping of the 2 email fields. line 920 sets a 217px width on the inputs as well so that's causing issues with the spacing on that field. There is also a left float applied to the inputs on line 920 that's breaking the field layout.

    Just removing those properties gets you closer to the normal layout.

    screenshot: http://grab.by/al3v

    The "complex" or advanced grouping fields are all set up using specific percentage widths so everything works properly.. the input position, the sub-label positions, etc. When you start making blanket changes to input widths, padding, etc. it tends to break those fields.

    I see the default form css isn't being loaded. I would suggest setting the "output CSS" option to "yes" so you get the defaults loaded, then add whatever rules you need to customize to the end of your theme stylesheet to override the defaults. I think you're going to get better results that way without having to restyle everything that's already in the plugin stylesheet.

    Posted 12 years ago on Sunday June 12, 2011 | Permalink
  5. Thanks Kevin,

    Excellent help as usual, and I took your advice and have now resorted back to outputting the built in CSS and only styling the required elements.

    Just ne final question, is it possible to "un-mask" the password fields? Is this CSS or JS?

    Thanks

    Posted 12 years ago on Monday June 13, 2011 | Permalink
  6. The "masking" is the way the default behavior for the password type field. It's a browser control and not something you control with JS or CSS. It's on all the time if you use that type of field.

    Posted 12 years ago on Monday June 13, 2011 | Permalink
  7. Thanks Kevin.

    Posted 12 years ago on Tuesday June 14, 2011 | Permalink