Doubt of how to increase input size according to div size using bootstrap

As far as I can see, you're using Asp.Net MVC and I had the same problem, so the solution is pretty simple.

When we created an Asp.Net MVC project, a file was created in the Content folder named Site.css and then I commented on the lines below, with this I had full control over the inputs

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

Try to put div with class form-group on the inside of the size definition of "columns" and class row to define each "line" of the form.

It would look like this:

<div class="form-horizontal">
    <div class="container">
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <div class="checkbox" id="divCheckBox">
                        @Html.LabelFor(model => model.Ativo, htmlAttributes: new { @class = "control-label" })
                        @Html.EditorFor(model => model.Ativo)
                        @Html.ValidationMessageFor(model => model.Ativo, "", new { @class = "text-danger" })
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="form-group">
                    @Html.LabelFor(model => model.Nome, htmlAttributes: new { @class = "control-label" })
                    @Html.EditorFor(model => model.Nome, new { htmlAttributes = new { @class = "form-control", placeholder = "" } })
                    @Html.ValidationMessageFor(model => model.Nome, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    @Html.LabelFor(model => model.Sigla2, htmlAttributes: new { @class = "control-label" })
                    @Html.EditorFor(model => model.Sigla2, new { htmlAttributes = new { @class = "form-control", placeholder = "" } })
                    @Html.ValidationMessageFor(model => model.Sigla2, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    @Html.LabelFor(model => model.Sigla3, htmlAttributes: new { @class = "control-label" })
                    @Html.EditorFor(model => model.Sigla3, new { htmlAttributes = new { @class = "form-control", placeholder = "" } })
                    @Html.ValidationMessageFor(model => model.Sigla3, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>
    </div>
</div>

I solved my problem after several attempts using the CSS property,
.form-control {min-width: 100%! important;}, this is the size of the parent div.

  

Code

@model Projeto.ERP.Model.Model.Genericos.PaisModel

@{
    ViewBag.Title = "Create";
    bool cadastradoComSucesso = ViewBag.cadastradoComSucesso;
    bool cadastroComErro = ViewBag.cadastroComErro;
}

<style>
    #Sigla2, #Sigla3 {
        text-transform: uppercase;
    }

    #painelAuditoria, #painelGeral {
        border-top: hidden;
        border-top-left-radius: unset;
        border-top-right-radius: unset;
    }

    .checkbox {

        margin-left: 14px;
    }

    .form-control {
        min-width : 100% !important;

    }

    label {
        font-weight: normal;
    }
</style>

@using (Html.BeginForm("Create", "Pais", FormMethod.Post, new { @id = "form" }))
{
    <div class="page-header">
        <h1>Cadastro de Paises</h1>
    </div>

    <div id="alerta">

    </div>

    <ul class="breadcrumb">
        <li class="active"> Editar </li>
        <li><a href="@Url.Action("Index", "Pais")"> Listar Paises </a></li>
    </ul>

    @Html.AntiForgeryToken()

    @Html.ValidationSummary(true, "", new { @class = "text-danger" })

    <ul class="nav nav-tabs" id="tabelaPresentarion">
        <li role="presentation" id="tabGeral" class="active"><a href="#">Geral</a></li>
        <li role="presentation" id="tabAuditoria"><a href="#">Audiroria</a></li>
    </ul>

    <div class="panel panel-default" id="painelGeral">
        <div class="panel-body">
            <div class="">
                <div class="container">
                    <div class="row">
                        <div class="form-group">
                            <div class="checkbox" id="divCheckBox">
                                @Html.LabelFor(model => model.Ativo, htmlAttributes: new { @class = "control-label" })
                                @Html.EditorFor(model => model.Ativo)
                                @Html.ValidationMessageFor(model => model.Ativo, "", new { @class = "text-danger" })
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group col-md-12">
                            @Html.LabelFor(model => model.Nome, htmlAttributes: new { @class = "control-label" })
                            @Html.TextBoxFor(model => model.Nome, htmlAttributes: new { @class = "form-control" })
                            @Html.ValidationMessageFor(model => model.Nome, "", new { @class = "text-danger" })
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group col-md-6">
                            @Html.LabelFor(model => model.Sigla2, htmlAttributes: new { @class = "control-label" })
                            @Html.TextBoxFor(model => model.Sigla2, htmlAttributes: new { @class = "form-control", placeholder = "" })
                            @Html.ValidationMessageFor(model => model.Sigla2, "", new { @class = "text-danger" })
                        </div>
                        <div class="form-group col-md-6">
                            @Html.LabelFor(model => model.Sigla3, htmlAttributes: new { @class = "control-label" })
                            @Html.TextBoxFor(model => model.Sigla3, htmlAttributes: new { @class = "form-control", placeholder = "" })
                            @Html.ValidationMessageFor(model => model.Sigla3, "", new { @class = "text-danger" })
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <input type="submit" id="btnSalvar" value="Salvar" class="btn btn-primary" />
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="panel panel-default" id="painelAuditoria">
        <div class="panel-body">
            <div class="form-horizontal">
                <div class="container">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <div class="col-md-offset-0 col-md-12">
                                    @Html.LabelFor(model => model.DataCadastro, htmlAttributes: new { @class = "control-label" })
                                    @Html.EditorFor(model => model.DataCadastro, new { htmlAttributes = new { @class = "form-control", @readonly = true } })
                                    @Html.ValidationMessageFor(model => model.DataCadastro, "", new { @class = "text-danger" })
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-md-offset-0 col-md-12">
                                    @Html.LabelFor(model => model.UsuarioCadastro, htmlAttributes: new { @class = "control-label" })
                                    @Html.EditorFor(model => model.UsuarioCadastro, new { htmlAttributes = new { @class = "form-control", @readonly = true } })
                                    @Html.ValidationMessageFor(model => model.UsuarioCadastro, "", new { @class = "text-danger" })
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <div class="col-md-offset-0 col-md-12">
                                    @Html.LabelFor(model => model.DataAlteracao, htmlAttributes: new { @class = "control-label" })
                                    @Html.EditorFor(model => model.DataAlteracao, new { htmlAttributes = new { @class = "form-control", @readonly = true } })
                                    @Html.ValidationMessageFor(model => model.DataAlteracao, "", new { @class = "text-danger" })
                                </div>
                            </div>
                            <div class="form-group">
                                <div class="col-md-offset-0 col-md-12">
                                    @Html.LabelFor(model => model.UsuarioAlteracao, htmlAttributes: new { @class = "control-label " })
                                    @Html.EditorFor(model => model.UsuarioAlteracao, new { htmlAttributes = new { @class = "form-control", @readonly = true } })
                                    @Html.ValidationMessageFor(model => model.UsuarioAlteracao, "", new { @class = "text-danger" })
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Lista de Paises", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")

    @if (cadastradoComSucesso)
    {
        <script>
            var functionSuccess = function () {
                $('#alerta').html('<div class="alert alert-success" role="alert"> Registro cadastrado com sucesso.</div>')
                $('#alerta').fadeIn(9000);
            };

            functionSuccess();

            $('#alerta').fadeOut(5000);

            $('#btnSalvar').prop('disabled', true);
        </script>
    }
    else if (cadastroComErro)
    {
        <script>
            var functionWarrning = function () {
                $('#alerta').html('<div class="alert alert-danger" role="alert"> Erro ao salvar registro.</div>')
                $('#alerta').fadeIn(9000);
            };

            functionWarrning();

            $('#alerta').fadeOut(5000);
        </script>
    }
    <script>
            jQuery(document).ready(function () {



                var tabGeral = $('#tabGeral');
                var tabAuditoria = $('#tabAuditoria');

                var painelGeral = $('#painelGeral');
                var painelAuditoria = $('#painelAuditoria');

                tabGeral.click(function () {
                    painelGeral.show();
                    painelAuditoria.hide();

                    $('.nav.nav-tabs li').each(function () {
                        if ($(this).attr('class') == "active") {
                            $(this).removeClass('active');
                        }
                    });
                    $(this).addClass('active');
                });

                tabAuditoria.click(function () {
                    painelGeral.hide();
                    painelAuditoria.show();

                    $('.nav.nav-tabs li').each(function () {
                        if ($(this).attr('class') == "active") {
                            $(this).removeClass('active');
                        }
                    });
                    $(this).addClass('active');
                });

                tabGeral.click();
            });

    </script>
}