[SOLVED] Customizing Form Look

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

[SOLVED] Customizing Form Look

Post by CMSmonkey »

I am using CMSMS 1.6.5 and Form Builder 0.5.12.

I have a form that is separated into 2 sections - one collecting personal information, and the second collecting general medical information.  I distinguished these sections just by using a static text field.  Rather than have the entire form in one column, I would like to put the 2 "sections" next to each other.

So instead of this:

Personal Information

Name: ___________
Email: _______________

General Medical Information
Weight: _______
Height: _______


I want something like this:

Personal Information                    Medical Information:

Name: __________                     Weight: _________
Email: ____________                   Height: __________



Is this possible?  Currently I am just using the "Table Template - Title on Top" template.

Thanks in advance for the assistance.
Last edited by CMSmonkey on Mon Oct 12, 2009 9:38 pm, edited 1 time in total.
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Customizing Form Look

Post by Dr.CSS »

Yes it can be 2 col. but I would do it using non table template with 2 fieldsets so they could both float left and sit side by side...
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

Re: Customizing Form Look

Post by CMSmonkey »

Dr. CSS wrote: Yes it can be 2 col. but I would do it using non table template with 2 fieldsets so they could both float left and sit side by side...
Thanks, Dr. CSS - but I haven't a clue how to do this.  Can you provide any insight?  I also noticed that you moved this from the Modules & Add-Ons forum to the Layout and Design (CSS & HTML) forum -- could this project be done entirely with CSS or do I still need to configure the form template?
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Customizing Form Look

Post by Dr.CSS »

Using non table template, when making the form add a fieldset with a class of your choosing first then add another one give it class of personal add all fields for personal info then close that fieldset add another filedset class of medical add other fields for info close fieldset, close first fieldset...

In CSS set width of first filedset, then for next 2 fieldsets give width of 49% of first one then float both left with a bit of margin on medical one this should get them to sit side by side, of course you style the rest as needed...
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

Re: Customizing Form Look

Post by CMSmonkey »

EXCELLENT!  Thank you SOOOOOOOOOOOOO much for the help.  I am going to try that out.
Post Reply

Return to “Layout and Design (CSS & HTML)”