1

Estimados colegas vengo con una duda y a la vez ayuda esto haciendo usando de table de boostrap pero al momento de generar la vista movil la tabla con el jumbotron se descuadra por decirlo así se coloca hacia la derecha, que podría estar realizando erróneamente?

introducir la descripción de la imagen aquí

    @page
@model DetalleModel
@{

}
<div class="container-fluid center">
    <div class="col-sm-12 col-md-12 col-lg-12 text-center">
        <table class="col-sm-12 col-md-12 col-lg-12">
            <tbody class="col-sm-12 col-md-12 col-lg-12">
                <tr>
                    <th class="jumbotron" style="padding: 15px;">
                        <h1 class="display-4 font-weight-bold">@Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_CONCEPTO</h1>
                        <p class="display-4">Información sobre Tratamiento </p>
                        <hr class="my-4">
                        <p class="font-weight-bold"> El Valor del Tratamiento es de :   @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_VALOR</p>
                        <p class="font-weight-bold">El Porcentaje de Descuento del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_POR_DESC %</p>
                        <p class="font-weight-bold">El Descuento del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_DESC</p>
                        <p class="font-weight-bold">El Total del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_TOTAL</p>
                        <form asp-area="Presupuesto" asp-page="Registro" method="post">
                            @{
                                var dataTratamiento = JsonConvert.SerializeObject(Model.MODEL_TRATAMIENTO.DataTratamiento);
                            }
                            <input type="hidden" name="dataTratamiento" value="@dataTratamiento" />
                            <input type="submit" value="Editar" class="btn btn-success ">
                        </form>
                    </th>
                </tr>
            </tbody>
        </table>
    </div>
</div>
1

1 respuesta 1

1

Una vez de verificar y recibir unas cuantas ayudas y sugerencias quedo el codigo de la manera en la que el cliente me lo pide.

    @page
@model DetalleModel
@{

}
<div class="container center">
    <div class="row text-center">
        <div class="col-12 col-sm-12 col-md-12 col-lg-12 table-responsive">
            <table class="table table-striped">
                <tbody>
                    <tr>
                        <th>
                            <div class="jumbotron" style="padding-bottom:0px; padding-top:0px; background-color:transparent; margin-bottom:2px;">
                                <h1 class="font-weight-bold" style="padding:15px;">@Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_CONCEPTO</h1>
                            </div>
                            <blockquote class="blockquote text-center">
                                <footer class="display-4 blockquote-footer">Información sobre Tratamiento </footer>
                            </blockquote>
                            <hr class="my-4">
                            <p class="font-weight-bold"> El Valor del Tratamiento es de :   @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_VALOR</p>
                            <p class="font-weight-bold">El Porcentaje de Descuento del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_POR_DESC %</p>
                            <p class="font-weight-bold">El Descuento del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_DESC</p>
                            <p class="font-weight-bold">El Total del Tratamiento es de : @Model.MODEL_TRATAMIENTO.DataTratamiento.TRA_TOTAL</p>
                            <form asp-area="Presupuesto" asp-page="Registro" method="post">
                                @{
                                    var dataTratamiento = JsonConvert.SerializeObject(Model.MODEL_TRATAMIENTO.DataTratamiento);
                                }
                                <input type="hidden" name="dataTratamiento" value="@dataTratamiento" />
                                <input type="submit" value="Editar" class="btn btn-success" style="margin-bottom:10px;">
                            </form>
                        </th>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

Aquí como se ve al ejecutar el código.

introducir la descripción de la imagen aquí

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.