Responsive forms - Post ID 202679

User 2449288 Photo


Registered User
3 posts

Is it possible to edit the html/css of a form so it becomes responsive to different media widths?
Any help/suggestions would be greatly appreciated, thanks!:)
User 2073552 Photo


Registered User
1,625 posts

Yes, once you create the form and export it or upload it to S-Drive you can edit the HTML, CSS in any manner you wish.
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 38401 Photo


Senior Advisor
10,951 posts

Do keep in mind though that some things may revert back if you edit the form again in the Form Builder software as it doesn't "import" those changes you make outside the program. Write down what you change and where to make rechanging it easier on any later updates :)
User 2449288 Photo


Registered User
3 posts

Thanks for the replies! Im guessing to make the form responsive it's a case of using css to control each div within the form to make them responsive, to adapt to different screen widths? Do you know if this has been done with coffee cup forms before? and if so how?

Thanks again!
User 2449288 Photo


Registered User
3 posts

Here is what i would like to achieve: http://test.theturninggate.net/responsive-forms/
User 2073552 Photo


Registered User
1,625 posts

The responsive Text area can be done by adding this to the div.

div
{
resize:both;
overflow:auto;
}

The responsive form can just be done by changing the site positioning.
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 232214 Photo


COO
827 posts

Web Form Builder now allows you to create responsive web forms. By our count it is the first software in the world that makes responsive forms (and responsive designs in general!) with just drag and drop.

Check it it: http://www.coffeecup.com/web-form-builder/#responsive
The future of web layout has arrived and it's called CSS Grid. CoffeeCup helps you to get ready with a free guide, the Grid Builder app plus cool demos & themes.
User 502476 Photo


Registered User
7 posts

When opening a responsive theme or basic theme from the zip folder to design a completely new theme, I notice there are two resource folders one for PNG files and the other for WIF files. If your using another graphics app such as photoshop instead of Web Image Studio to design your PNG files for that theme, do you really need the resource folder with the WIF files in them. Can that resource folder just be deleted ?
User 103173 Photo


VP of Software Development
0 posts

Domenic Turillo wrote:
When opening a responsive theme or basic theme from the zip folder to design a completely new theme, I notice there are two resource folders one for PNG files and the other for WIF files. If your using another graphics app such as photoshop instead of Web Image Studio to design your PNG files for that theme, do you really need the resource folder with the WIF files in them. Can that resource folder just be deleted ?

Sure, if you have no plans on editing them with Web Image Studio.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.