css - 热去除网格之间的大空间

标签 css twitter-bootstrap-3

我试图在缩略图中显示一些广告,但它们之间有很大的空间..看看 enter image description here

我正在使用 bootstrap 缩略图来展示产品。

                echo '<div class="col-sm-6 col-md-3">
                          <div class="thumbnail">
                             <img src='.$source.' 
                             alt="Generic placeholder thumbnail">
                          </div>
                          <div class="caption">
                             <h3>'.$title.'</h3>
                             <p>Price:Rs.'.$price.'</p><br>
                             <p>
                                <a href="'.$adress.'" class="btn btn-primary" role="button">
                                   View
                                </a> 
                                <a href="#" class="btn btn-primary" role="button">
                                   Update
                                </a> 
                                <a href="#" class="btn btn-default" role="button">
                                   Delete
                                </a>
                             </p>
                          </div>
                        </div>';

CSS Bootstrap :

element.style {
}
@media (min-width: 992px)
.col-md-3 {
width: 25%;
}
@media (min-width: 992px)
.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
float: left;
}
@media (min-width: 768px)
.col-sm-6 {
width: 50%;
}
@media (min-width: 768px)
.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
float: left;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
* {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
margin: 0;
}
user agent stylesheetdiv {
display: block;
}
Pseudo ::before element
:before, :after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
Pseudo ::after element
:before, :after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
Inherited from body
body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.42857143;
color: #333;
background-color: #fff;
}
Inherited from html
html {
font-size: 10px;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
html {
font-family: sans-serif;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}

请帮我删除大空间。元素不在一条线上。

最佳答案

尝试填充:特定网格为 0

关于css - 热去除网格之间的大空间,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25890708/

相关文章:

css - Bootstrap 3 : How to code my banner?

html - 具有内联样式的 CSS 伪类

css - 移动响应式设计

javascript - 使用 SlideUp AngularJs 和 Bootstrap 让警报重新出现

css - 将标题菜单/导航栏的文本变成小视口(viewport)的图标(rails 4/bootstrap3)

twitter-bootstrap - Bootstrap 3 Jumbotron 有圆边(我如何摆脱它们?)

javascript - 需要帮助解决如何为 html/css slider 添加更好的图像标题

html - 并排对齐 P 标签中的文本,同时保持 Break-Word

javascript - ReactJS - 隐藏具有特定背景图像的 div

twitter-bootstrap-3 - MVCSiteMapProvider MVC 5 与 Bootstrap 3.2