close ad
Help us test the new Databridge BETA with MySQLi support
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

rating

Data Bridge - Forms

Thread began 11/11/2012 4:12 pm by thehalpeen319342 | Last modified 11/15/2012 10:01 am by Jason Byrnes | 787 views | 8 replies |

thehalpeen319342

Data Bridge - Forms

I'm preparing a form with the assistance of Form Builder. I want to tighten the form up, reduce the spacing between text fields, reduce the height of the text fields, etc. Where can I do this?

I've hit the edit Css button in the Form Builder, but I see no options here to change the usual 'input tag' , 'label tag', 'paragraph tag', etc. Normally in Dreamweaver, I would use these three tags to layout the fields and labels.

Sign in to reply to this post

Jason ByrnesWebAssist

In the Edit CSS Screen, from the initial menu select Form Elements, then select the element you wish to edit.

the Element groups and element labels padding and margin settings will control how close the elements are to each other.

Sign in to reply to this post

thehalpeen319342

I think I adjusted those parts, but I'll try again - thanks.

Sign in to reply to this post

thehalpeen319342

Okay, great, by adjusting the padding I was able to tighten up the form.

I understand the structure now, but I cannot figure out the fields I have circled on the attached screenshot - what do they control/adjust in the text area of the form. When I change from x-large to say x-small, nothing seems to happen.

Attached Files
Form Elements - Text.pdf
Sign in to reply to this post

Jason ByrnesWebAssist

when adding text boxes to the form, you can select to add a small text box, a large text box, extra large etc..

the styles you are circling effect those text boxes, if you don't have a x large text box in your form, you wont see any change.

Sign in to reply to this post

thehalpeen319342

Ok. I can tighten the text boxes, but how do I increase or decrease the padding in a text field - can it be done in the Form Elements section - I can't see where. I've been able to reduce or increase the size of the font in the text field, but where can I increase or decrease the padding inside the text field?

Sign in to reply to this post

Jason ByrnesWebAssist

The padding inside a text field is controlled more by the text fields height in relation to the font size.

Sign in to reply to this post

thehalpeen319342

Sorry Jason, I don't understand. In Dreamweaver, you control the padding of the text fields. In Dreamweaver, i control the text fields by selecting the following tag: <input type="text" name="fname" id="fname" /> - this controls the padding inside the field. Can CSS Form Builder do the same?

Sign in to reply to this post

Jason ByrnesWebAssist

text boxes don't support padding the across all browsers. and really the padding will be ignored based on the height of the form element and the size of the font.

for example if you have a text element that is 20px height and the font is 15px; you can specify a padding of 5px top, 5px bottom, instead you need to set the height of the element to 25px

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...