What CSS controls the right and left margins between these form elements in Twitter Bootstrap?

enter image description here

I can’t figure out what controls the margins between these inline form elements. For example the margin between the two text input fields.

EDIT: I know how to control to alter these margins, but why is there a margin between them AT THE MOMENT. I can’t find any CSS in bootstrap that is responsible for these 3 or 4px margins between them at the moment.


solution

Here are the CSS selectors you will need..

**Margin the inputs/fields** :

.form-inline .form-group {
  margin: 0px 10px; /* Add something like this */
}

**Margin for the checkbox/radio button** :

.form-inline .radio, .form-inline .checkbox {
  margin: 0px 10px; /* Add something like this */
}

**Margin for the submit button:**

.bs-example > .btn, .bs-example > .btn-group {
  margin: 0px 10px; /* Add something like this */
}

**Margin for the entire inline form**

.bs-example {
  margin: 0px 30px; /* Add something like this */
}

And to answer your question, there are currently margins between elements, because that is the default. If you wish to remove them, I would suggest doing this manually by adding negative margins to the CSS controls I specified above. For instance, if you wish to remove the margins between the inputs, do this:

.form-inline .form-group {
  margin: 0px -3px; /* Add a negative margin to remove it*/
}