From Width - stuck at 500px

Creative Contact Form is a responsive jQuery contact form with amazing visual effects. You will be surprised by count of all the possible features!
Mon Jul 04, 2016 11:50 am

  • Hi, all going great and loving CCF, but having issue with form width (popup)

    I have the form width set in % (100), but it is always showing at 500px, which is not too big an issue until I do the responsive test and anything below 500px wide, the popup is too wide.

    I have searched hi and low and cannot work out why, or where, the 500px parameter is coming from. And cannot override with CSS as it appears in the inspector as:
    element.style {
    width: 500px !important;
    }

    The page in question is: http://staging.reddirtstudio.net.au/ and the popup in question is from the '2016 Specials!' button on the left below the logo.

    Any help greatly appreciated!

    Simon
    User avatar
    sambob
     
    Posts: 6
    Joined: Wed May 18, 2016 11:27 am
    Location: Albury, NSW, Australia

Mon Jul 04, 2016 9:14 pm

  • Hi,

    For Popup forms it does not accept values in percents, and applies default 500px value, if you specified form width in percents. To change that value, just specify form width in pixels. For example: 600px.
    Best Regards,

    Simon
    User avatar
    Simon
    Site Admin
     
    Posts: 1620
    Joined: Wed Mar 05, 2014 1:04 am

Tue Jul 05, 2016 5:12 am

  • Hi Simon, thanks for your reply.

    ok, but how do I get it to resize for small screens?

    Whatever I enter it renders it as width ??px !important, and I cant add a custom width for a media call.
    User avatar
    sambob
     
    Posts: 6
    Joined: Wed May 18, 2016 11:27 am
    Location: Albury, NSW, Australia

Tue Jul 05, 2016 8:47 pm

  • Hi,

    As I mentioned, for popup it uses fixed width, which you should specify as Form Width option.

    For small screens it will open the same width like 500px or whatever you set in options.
    There is no responsive functionality for popups.
    Best Regards,

    Simon
    User avatar
    Simon
    Site Admin
     
    Posts: 1620
    Joined: Wed Mar 05, 2014 1:04 am

Mon Jul 11, 2016 6:51 am

  • Thanks Simon...
    User avatar
    sambob
     
    Posts: 6
    Joined: Wed May 18, 2016 11:27 am
    Location: Albury, NSW, Australia

Mon Jul 11, 2016 3:56 pm

  • You are welcome my friend.
    Best Regards,

    Simon
    User avatar
    Simon
    Site Admin
     
    Posts: 1620
    Joined: Wed Mar 05, 2014 1:04 am

Wed Jul 17, 2019 2:17 pm

  • An old message but I got the same problem and like to share. The CCF business version is a great extension! I hope it will be continued. Here's my Fix for mobile view or small screens:
    In Forms choose your form
    Form width (for example)
    Code: Select all
    480px !important

    Add the css code below to your custom css or whatever css can add a override.
    Code: Select all
    .creativecontactform_wrapper.creative_form_module.creative_form_18.ccf_icon_1.ccf_sections_template_2.ccf_popup_form {width: 480px !important;}

    And the same code in a @media declaration after the custom css code above.
    Code: Select all
     
    @media only screen and (max-width: 480px) {.creativecontactform_wrapper.creative_form_module.creative_form_18.ccf_icon_1.ccf_sections_template_2.ccf_popup_form {width: 320px !important;}
    }

    (where the ID 18 in class .creative_form_18 must be changed the ID of your form of course)
    use of !important is ...important. Don't like that use but it's a fix.
    To delete the important rule for the specific declaration in the hard code of ccf is not a good idea (I think).
    hout
     
    Posts: 4
    Joined: Tue Nov 06, 2018 2:17 am

Sat Aug 31, 2019 8:36 pm

  • Hi,

    Thanks for workaround.

    I've added responsive or small screens functionality support for popup forms to CCF TODO list.
    So that will be fixed on next releases.
    Best Regards,

    Simon
    User avatar
    Simon
    Site Admin
     
    Posts: 1620
    Joined: Wed Mar 05, 2014 1:04 am



Return to Creative Contact Form




Information
  • Who is online
  • Users browsing this forum: No registered users and 11 guests
cron