twitter/bootstrap — pull request #7529 by peterhil (2013-04-10 13:32:27+00:00)
Title: Fluid responsive modals 2.2.2

Hi!

I made styles for fluid modals that always fit small viewports (mobile devices).

The first commit 9ce48eb5417dd1d20edaece0231194c45a63c0ee shows the basic idea,
and two later ones fix the modal height when content is short and override some default styles and some polishing touches (rounded corners on body when header or footer is missing).

Media queries could also be used to overflowflow-wrap text on narrow viewports:

@media (max-width: 600px) {
.row-fluid {
overflow-wrap: break-word;
word-wrap: break-word; // IE
hyphens: auto;
-webkit-hyphens: auto;
}
}

Media query styles could also be used for a "page like" view on mobile devices, to that the modal fits the whole screen. I may do this later.

A big problem with bootstrap modals is that the modal is fixed positioned and outside modal-backdrop. This would be much easier to achieve, if the modal HTML element would be inside fixed modal-backdrop and be absolutely positioned. However, I didn't want to touch the Javascript yet.

Btw, what's with the strange coding convention of not using any semicolons and putting commas at the start of the lines?