Question

I’ve found one way to do this:

use margins to control dialog position so margin: -335px 0 0 -280px;

setting the width you must reset the margins width: 900px; margin: -250px 0 0 -450px;

to set the height use max-height max-height: 800px;
based on

http://www.revillwebdesign.com/change-the-height-width-and-position-of-a-modal-in-twitter-bootstrap/

Is there a better way to do this? Using this or another approach, is there a way to only have the dialog slide down to top:0px and stay there until dismissed?

Using the first margin settings I mentioned does this but obviously as soon as the browser is resized it will get pushed out of view.

Answer 1

Simply override the CSS position, eg

.modal, .modal.fade.in {
    top: 0; /* was 10% */
}

Note, this is with Bootstrap 2.2.2. The only margin is a negative left margin that is half the width of the modal (centres the modal horizontally). No top margins are required.

jsFiddle example here – http://jsfiddle.net/uuwAn/1/