Javascript 引导模式延伸到整个页面宽度？

我正在实现modal，它可以扩展到整个页面宽度，不像bootstrap网站上演示的那样

<div class="modal fade" id="contact" role="dialog">
            <div class="modal-disalog">
                <div class="modal-content">
                    <div class="modal-header">
                        <p>Contact Us</p>
                    </div>
                    <div class="modal-body">
                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
                    </div>
                    <div class="modal-footer">
                        <a class="btn btn-info" data-dismiss="modal">Ok</a>
                    </div>
                </div>
            </div>
        </div>

联系我们

这是一位杰出的领袖，他是一位伟大的领袖

好啊

只有输入错误：

<div class="modal-disalog">

应该是

<div class="modal-dialog">

并且应该应用正确的css规则。

第2行的class=“modal dialog”不是class=“modal disalog”

这应该行得通

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel" style="color: gray;">Title</h4>
                </div>
                <div class="modal-body" style="color: black;">
                 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>

&时代；
标题
这是一位杰出的领袖，他是一位伟大的领袖

接近
保存更改