Less space between a field and another in webform with theme SKY

HTML & CSS
1

I’m using ky theme, it is super nice, but with webform and some fields in it, it take a lot of space vertically,
here 2 examples::
http://www.ebagno.it/prodotti/190-fly-111-rovere-sb-base-fly-colonna-fly
http://www.ebagno.it/prodotti/198-fly-111-doors
You can find it at the bottom of any page.
How I can get webform on the bottom of this age more short vertically?

2

I just want to get it more short, for exaple moving fields in this looking:
Nome e Cognome: | Ragione Sociale:
E-mail: | Provincia di consegna:
Telefono: | Cellulare:
Quando telefonare:
Informazioni:

3

If you want the labels on the left and the controls on the right then float the labels with a width.

Something like this:


.webform-component-textfield{clear:both;width:100%;overflow:hidden}
.webform-component-textfield input,.webform-component-email input,.content #webform-component-informazioni textarea{width:400px}
.webform-component-textfield label,.webform-component-email label,.webform-component-textarea label{width:12em;float:left;padding:0 1em 0 1.5em;}
#edit-submit{margin-left:14.5em}
4

Next step I’ll try to set forms in 2 columns, following these instructions: http://drupal.org/node/79086

5

The code I gave above arranges the controls neatly in 2 columns with the labels aligned to the left and the inputs aligned to the right as should be expected. I don’t think any other method would be advisable or usable a sit is always better to have the controls in an orderly fashion.

6

Super super thanks! problem solved!
Just please one more question: how to align text of fields on the left and not centered as now?

7

Hi,

The vertical margins between the form elements seem to be set from styles.css here:


.form-item, .book-outline-form .form-item {
    padding: 0;
   [B] margin: 1.5em 0 2.5em 0;[/B]
    width: auto;
}

Try reducing the top and bottom margins to see if that’s what you wanted.


.form-item, .book-outline-form .form-item {
    padding: 0;
   [B] margin: .3em 0 .3em 0;[/B]
    width: auto;
}
8

Sorry - missed your reply but it seems you have worked it out now anyway :slight_smile: