Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #218310

    Hi Support,

    I’ve just created an application form using Gravity Forms on my site and noticed that the popup that displays to choose a date is displaying incorrectly. You can take a live look at the popup by clicking in the “Date” field about halfway down the form, on this page: http://hospitalityscholarships.org/application/. Believe it or not, the popup actually seems to display fine in IE8 but is noticeably broken in Chrome and Firefox. Any ideas on how to get it to display correctly?

    I can always just use a blank text field and have users enter a date manually, but using the built-in Gravity date-picker makes the form entries a little more consistent as far as formatting goes. I’d reach out directly to Gravity on this one, but I know Enfold is supposed to support Gravity Forms and I have a date-picker that displays fine on another site not built on Enfold, so I think the issue might be stemming from some Enfold styling.

    WP: 3.8.1
    Enfold: 2.4.5
    Site: http://hospitalityscholarships.org/application/

    Thanks!

    Ryan

    #218361

    Hello,

    Have you tried disabling all third-party (except Gravity Forms) plugins to see if it gets fixed?

    Regards,
    Josue

    #218554

    Hi Josue,

    Thanks for the prompt response, it’s much appreciated. Yes, I disabled all my plugins (BackupBuddy, Tailored Login, WP-Optimize, bbPress), and still had the issue. Any other thoughts on a possible cause?

    Best,

    Ryan

    #218651

    Hi,

    Open css/base.css and look for line 195-196:

    	#top textarea,
    	#top select {
    

    Replace it by this:

    	#top textarea {
    

    In the same file, also remove 233-234:

    	#top select {
    		width: 220px; }
    

    Regards,
    Josue

    #218664

    Hi Josue,

    That seems to have helped fix things in Firefox (not perfect but certainly better), but the date-picker still isn’t displaying correctly in Google Chrome. Any ideas? Like I said, I don’t mind switching to a simple text field to enter the date if it’s too much trouble to fix.

    Thanks!

    Ryan

    #218668

    Josue,

    I spoke to soon… the calendar now displays as it should across the browsers, thanks! The only things that doesn’t look quite right are the dropdown boxes for the date and year. In Chrome the dropdown arrows seem to be behind the text and in Firefox the dropdown boxes are a little small. I think we’ve almost got it solved :)

    Thanks again,

    Ryan

    #218794

    Hi!

    Please try adding following code to Quick CSS as well

    .ui-datepicker-title select { padding-right: 17%; }

    Regards,
    Yigit

    #218932

    Josue and Yigit,

    Thanks for your help with this, everything looks good now :D

    Ryan

    #218935

    You are welcome Ryan, glad we could help :)

    Regards,
    Josue

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Gravity Forms Date Picker Popup Displays Incorrectly’ is closed to new replies.