Bootstrap: .modal-dialog on narrow SM screen has no horizontal margin

[cvrebert]

Refs https://github.com/twbs/bootstrap/issues/19969#issuecomment-221954529

[RyanZim]

Testcase: https://jsfiddle.net/x1qpe0mm/

[cvrebert]

(The test requires the viewport to be between 544px and 599px.)

[rwaltenberg]

A left/right padding to the .modal-dialog would do the job: https://jsfiddle.net/x1qpe0mm/1/

@media (min-width: 544px) {
  .modal-dialog {
    max-width: 600px;
    margin: 30px auto;
    padding: 0 10px;
  }
}