在Bootstrap中的模态窗口中使用嵌套列

Question

我有一个模态窗口。在这个窗口里面，我有两列。一列包含复选框列表。另一列包含图片和一些文字。在右栏（带图片和文字）中，我想使用嵌套列（如BS文档http://getbootstrap.com/css/#grid-nesting中所示）将图片和文本放在一行上。现在，他们堆积如山。可能原因是模态窗口的宽度？因为html代码就像在文档中一样。但是它没有用。

我需要这样的东西：

可能需要使模态窗口更宽一些吗？

代码是：

 <!-- Modal -->
<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">Sed at dignissim mauris?</h4>
            </div>
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-6">
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox"> Suspendisse in cursus leo, a
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox">Sed ligula elit, lacinia eget pretium
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox"> Phasellus fermentum fringilla orci
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox">  Mauris interdum, sem non
                                </label>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="row">
                                <div class="col-lg-4">
                                    <img src="Images/testimage.png" />
                                </div>
                                <div class="col-lg-9">
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                                    Ut lobortis arcu sit amet commodo suscipit. Nulla fringilla velit erat,
                                    eget tristique elit ultrices eget. Sed cursus nunc in pretium scelerisque.
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

我修复了列问题，现在模态窗口宽度出现问题

我该如何解决它？

Answer 1

我假设您使用的是12列网格，因此即使嵌套，您的列也不应超过12列。如果你看起来你正在使用'col-lg-4'和'col-lg-9'，总数为13.将其中一个减少1，它应该可以工作。