0
I have a modal window and every time the view expands, it self-adjusting and creating a vertical scrollbar and including Header. It is possible to make this vertical scroll bar not include Header (as highlighted in red)?
Modal
<div class="modal fade modal-primary" id="modalGenerica" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div id="contentModal">
</div>
</div>
</div>
</div>
HTML (Asp.net Razor)
<div>
<form asp-action="Create" id="frmCreate">
<div class="modal-shadow">
<div class="modal-header modal-header-primary">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<h4 class="modal-title text-center"> @ViewData["Title"] </h4>
</div>
@await Html.PartialAsync("_PessoaFisicaJuridica")
<div class="modal-footer">
<div class="col-md-offset-2 col-md-10">
<button id="btnSalvar" type="submit" class="btn btn-primary"><i class="icon wb-check"></i> Salvar </button>
<button id="btnFechar" class="btn btn-danger" data-dismiss="modal"><i class="icon wb-close"></i> Fechar </button>
</div>
</div>
</div>
</form>
</div>
CSS
.modal-content {
height: 90%; /*altura da modal*/
}
.modal-dialog {
max-width: 70%; /*largura da modal*/
height: 100%; /*altura da view da modal (não alterar)*/
margin: 0 auto !important; /*centralizar modal horizontalmente*/
}
#contentModal {
overflow: auto; /*habilita o overflow no corpo da modal*/
}
#modalGenerica {
overflow: hidden; /*evitar overflow da view da modal*/
}
puts a
height: 100%
inside#modalGenerica
and see if the bar keeps showing up, it may not have a defined height on theoverflow: hidden
and why it is appearing. If you continue to create a practical example using the code tool.– Pilati
In fact the scrollbar should always appear when needed... I just wish it didn’t use Header. That was as it is selected in red.
– Master JR