Question

有没有人对如何创建两个面板模态有任何想法。因此，例如，一方将是登录表单或其他方面，另一方将是用户获得的列表。或者一方是物理联系信息div，另一方是电子邮件联系表。我尝试在模态div标签下做两个div，并且每个span5或span6有一个拉 - 左拉另一个拉 - 但它不起作用。我问，因为我有这个问题。也有人能告诉我为什么我的联系表格在标签和输入框之间有这么大的空间吗？转到scoopclassifieds.com（不试图插入我的网站，不能发布图片）并点击联系我们。我把html标记放了一遍

<div class="modal hide fade" id="contactForm" aria-hidden="true">
                    <div class="modal-body">
                                <form action="" method="post" class="form-horizontal">
            <div class="control-group">
                <label class="control-label">Email:</label>
                <div class="controls">
                    <input type="text" name="email" id="email" class="input" />
                </div>
            </div>
            <div class="control-group">
                <label class="control-label">Subject:</label>
                <div class="controls">
                    <input type="text" name="subject" id="subject" class="input" />
                </div>
            </div>
            <div class="control-group">
            <label class="control-label">Message:</label><br/><br/>
                <div class="controls">
                   <textarea rows="5" class="input span4" name="message" id="message"></textarea>
                </div>
            </div>
            <div class="control-group"><div class="controls"><input type="submit" name="contactUs" id="contactUs" class="btn" value="Contact Us" /></div></div>
                        </form>
                    </div>
                </div>

很抱歉，如果代码格式太可怕了。我使用cpanel文本编辑器来开发它。我知道这是个坏主意，但我必须尽可能快地提供一个实例。

Answer 1

尝试在row-fluid内加modal-body，然后在span6内加<div class="modal-body"> <div class="row-fluid"> <form class="span6"> </form> <div class="span6"> </div> </div> </div>。

.modal {
    width:45%;
    left:45%;
}

您可能还想增加模态的默认宽度..

{{1}}

Bootply上的演示：http://bootply.com/69517

twitter bootstrap - 创建一个两个面板模式

1 个答案: