asp.net-mvc - 使用 Bootstrap，如何为内容创建 2 列？ - 包括示例

Question

我刚开始使用 Bootstrap，想为我的帖子创建一个并排有 2 列的响应式布局。 Example

我想实现在 Portfolio 下看到的 2 列排列。我查看了源代码，看到了标准 Bootstrap 中似乎没有包含的各种类。我正在使用 VS2013 中的 MVC6 元素中包含的 Bootstrap 版本。向正确方向提供的任何帮助或插入都将受到赞赏。

我尝试约会导致 this发生。我最终得到了差距。

这里是导致出现间隙的 MVC 代码:

    <div class="container">    
    @For Each item In Model.ToList         
            @<div class="col-md-6">
                <div class="item">
                    <div class="content">
                        @Html.Raw(GetImageHelper.getImage(True, item.PostSummary))
                        <h3>
                            @item.PostTitle
                        </h3>
                        @Html.Raw(item.PostSummary.StripStyle)    
                    </div>
                </div>    
            </div>    
       Next
</div>

谢谢

Answer 1

看来您没有正确使用清算。我对该问题的解决方案是使用 Bootstrap row 类。下面的例子也支持响应式:

<div class="row">
    <div class="col-md-6 col-xs-12"></div>
    <div class="col-md-6 col-xs-12"></div>
</div>
<div class="row">
    <div class="col-md-6 col-xs-12"></div>
    <div class="col-md-6 col-xs-12"></div>
</div>
...