A maneira mais limpa e simples de fazer isso é usar o Flexbox! A seguir, alinharemos verticalmente um modal do Bootstrap 3 no centro da tela e é muito mais limpo e mais simples do que todas as outras soluções postadas aqui:
body.modal-open .modal.in {
display: flex !important;
align-items: center;
}
NOTA: Embora essa seja a solução mais simples, ela pode não funcionar para todos devido ao suporte do navegador: http://caniuse.com/#feat=flexbox
Parece que (normalmente) o IE fica para trás. No meu caso, todos os produtos que desenvolvo para mim ou para os clientes são o IE10 +. (não faz sentido para os negócios investir tempo de desenvolvimento suportando versões mais antigas do IE quando ele poderia ser usado para realmente desenvolver o produto e liberar o MVP mais rapidamente). Certamente não é um luxo que todos tenham.
Vi sites maiores detectarem se o flexbox é suportado ou não e aplicar uma classe ao corpo da página - mas esse nível de engenharia de front-end é bastante robusto e você ainda precisará de um fallback.
Eu encorajaria as pessoas a abraçar o futuro da web. O Flexbox é incrível e você deve começar a usá-lo, se puder.
PS - Este site realmente me ajudou a entender o flexbox como um todo e aplicá-lo a qualquer caso de uso: http://flexboxfroggy.com/
EDIT: No caso de dois modais em uma página, isso deve se aplicar a .modal.in
.modal.fade.in
também