02.09.2016

Выравнивание модального окна по вертикали

В Bootstrap есть замечательные модальные окна, которые отлично адаптируются под все девайсы. Но у них есть один небольшой недостаток — он прижаты к верхней границе экрана.

Для выравнивания по вертикали модального окна Bootstrap необходимо добавить стили:

.modal {
	text-align: center;
}
@media screen and (min-width: 768px) { 
	.modal:before {
		display: inline-block;
		vertical-align: middle;
		content: " ";
		height: 100%;
	}
}
.modal-dialog {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}