Hey, I'm having an issue with displaying ads in a thumbnail format; there seems to be too much space between them. Take a look:
I've been utilizing Bootstrap thumbnails to showcase products.
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-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;
}
... (omitted for brevity)
If anyone could provide assistance on reducing the excessive spacing and getting the items aligned properly, that would be greatly appreciated!