在为我的网站制作一个首页时,我偶然发现了一个令人讨厌的css问题。请看下图:
如图所示,我想列出我的项目,没有空格。但是,到目前为止我的尝试都没有成功。。。
这是我的代码:

<div class="container">
    <div class="row">
        <div class="col-xs-12 col-md-9">
            <div class="row">
                <!-- gets repeated for all items in array -->
                <div class="col-md-6 col-xs-12" ng-repeat="flong in flongs">
                    <a href="/flong/id">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <img class="img-responsive center-block" src="http://placehold.it/350x175">
                                <p class="text-center"><b>Titel</b></p>
                            </div>
                        </div>
                    </a>
                </div>
                <!-- end loop -->
            </div>
        </div>
        <div class="col-xs-12 col-md-3">
            <div>
                <!-- gets repeated for all items in array -->
                <div class="row" ng-repeat="flong in flongs | limitTo: 5">
                    <div class="col-xs-12">
                        <a href="/flong/id">
                            <div class="panel panel-default">
                                <div class="panel-body">
                                    <img class="img-responsive center-block" src="http://placehold.it/350x175">
                                    <p class="text-center"><b>Titel</b></p>
                                </div>
                            </div>
                        </a>
                    </div>
                </div>
                <!-- end loop -->
            </div>
        </div>
    </div>
</div>

有人知道怎么解决这个问题吗?搞了4个多小时,我都受够了
On8Flongs就是这个问题的一个实例。
提前谢谢!
尼克·范德梅

最佳答案

在挣扎了几个小时之后,我终于明白了。这不是对CPU最友好的方式,但这里是:

<div ng-hide="isLoading()">
            <div class="col-md-6">
                <div ng-repeat="flong in flongs">

                    <a href="/flong/{{flong.id}}" class="no-text-decorations" target="_blank" ng-show="$even" ng-mouseover="flong.showBody = true" ng-mouseout="flong.showBody = false">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <img class="img-responsive center-block" src="http://placehold.it/350x175">
                                <p class="text-center"><b>title</b></p>
                                <p class="text-center" style="color:white;" ng-show="flong.showBody">body</p>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-md-6">
                <div ng-repeat="flong in flongs">

                    <a href="/flong/{{flong.id}}" class="no-text-decorations" target="_blank" ng-show="$odd" ng-mouseover="flong.showBody = true" ng-mouseout="flong.showBody = false">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <img class="img-responsive center-block" src="http://placehold.it/350x175">
                                <p class="text-center"><b>title</b></p>
                                <p class="text-center" style="color:white;" ng-show="flong.showBody">body test</p>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>

不管怎样,谢谢你的帮助!

关于html - 引导网格空白,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/28727989/

10-10 01:58