daniofilho
2/8/2017 - 6:43 PM

Bootstrap Modal Align Vertical

<style>
    .vertical-alignment-helper {
   	 	display:table;
	    height: 100%;
	   	width: 100%;
	   	pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
	}
	.vertical-align-center {
	    /* To center vertically */
	    display: table-cell;
	    vertical-align: middle;
	    pointer-events:none;
	}
	.modal-content {
	    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
	    width:inherit;
	    height:inherit;
	    /* To center horizontally */
	    margin: 0 auto;
	    pointer-events: all;
	}
</style>

<div class="modal fade" id="modalTeste" tabindex="-1" role="dialog">
    <div class="vertical-alignment-helper">
        <div class="modal-dialog modal-lg vertical-align-center" role="document">
                <!-- -->
        </div>
    </div>
</div>