[SOLVED] Form Builder- line breaks between form fields

[burlington]

Using CMSMS 1.11.2.1. Form Builder version 0.7.1

I am making a form for a person who wants more space between each of the form fields.

As I am not a PHP coder could anyone tell me the best way of achieving this.

Thank you

Martin

[timdebuurman]

Best do it in CSS

.formbuilderform div {
margin-bottom: 10px;
}

Something like that.

[burlington]

Thank you very much. Unfortunately it does not work. I have attached Form Builder Style Sheet to the template of course and have been trying various places and ways of including the piece of code you gave me.

This is what the Style Sheet consists of now:
<quote>
/* Sample FormBuilder CSS base */
form {
margin-top: 0
}
form, td, th, li {
font-size: 100%

}
form div {
margin-bottom: 10px;
}
fieldset div {
margin-bottom: 0.5em;
margin-left: 1em;
}
fieldset div div {
margin-top: 0.5em;
margin-left: 1em

}
fieldset {
margin-bottom: 1em;
border: 1px solid #F60;
padding: 0.5em

}
fieldset label {
width: auto;
}
legend {
color: #FFF;
background: #F60;
font-style: italic;
font-size: 1.2em;
margin-bottom: 0.5em;
padding: 0.2em;
width: auto;
border: 1px solid #CCC
}
textarea {
margin: 0.5em 0;
width: 98%;
height: 6em
}
/* Apply this class to text/select input fields with shorter labelsto help alignment */
.short-label label {
float: left;
width: 10em
}
.short-label fieldset div input, .short-label fieldset div select {
width: 16em
}
/* Pretty up your Captcha image output */
.captcha {
margin: 0.5em 0;
width: 200px;
text-align: center
}
.captcha img {
border: 1px solid #F60;
margin-bottom: 0.5em
}
.captcha input {
width: 196px;
margin-top: 0.5em
}
/* Just a bit more room for the Submit button */
.submit {
margin-top: 0.5em
}
.contactform input {
border: 1px solid #f60;
}
.contactform input.checkbox {
border: none;
}
.contactform label {
display: block;
float: left;
width: 150px;
}
.contactform label.label {
display: inline;
float: none;
width: 50px;
font-size: 10px;
}
.contactform textarea {
background-color: #ffc;
border: 1px solid #f60;
}
.formbuilderform .message {
line-height: 16px;
padding: 0 0 8px 0;
}

</quote>

Can anyone help please?

[timdebuurman]

try to add it to the
.contactform input

Code: Select all

.contactform input {
border: 1px solid #f60;
margin-bottom: 10px;
}

[burlington]

That works fine. Many thanks.

Martin