Input Spaces in Twiter Bootstrap

Question

In the registration forms the horizontal and vertical spacing are very large, I solved the problem by adding the style="margin-bottom:10px;margin-right:-10px" in each input, however, in the size Sm and xm of the columns it loses the direct charge with this solution.

<div class="row">
    <div class="col-sm-6 col-md-6 col-lg-6">
        <div class="form-group form-float" style="margin-bottom:10px;margin-right:-10px">
            <div class="form-line">
                <label style="margin-bottom:-5px;">CNPJ*</label>
                <input id="in_cpf_cnpj" name="cpf_cnpj" type="text" class="form-control" readonly>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-md-6 col-lg-6">
        <div class="form-group form-float" style="margin-bottom:10px;margin-left:0px">
            <div class="form-line">
                <label style="margin-bottom:-5px">Inscrição estadual*</label>
                <input id="in_rg_insc_estadual" name="rg_insc_estadual" type="text" class="form-control">
            </div>
        </div>
    </div>
</div>

I also found this with the look of gambiarra. It has to leave standard for all inputs?

Answer 1

Add the following to a custom css sheet:

.form-group {
    margin-bottom:10px;
    margin-right:-10px;
}

I advise using it in a custom css sheet and not in the bootstrap pattern. If you update the bootstrap version, you will not miss the updates.