Я хочу добавить пробел между столбцами, но все еще имею 3 поля по 1 строке в размере 4. Я попытался добавить поле к .col-style-3, потому что это не сработало, но выдвинуло их из положения. Также я попытался добавить отступы, но так как я использую границу, отступ будет просто отталкивать мою границу. Я также пытался добавить col-sm-12 в мою col-sm-4 ведьму, которая может работать, но тогда транзакция работает проводной, и я знаю, что это не правильный способ сделать это. Любые предложения о том, как решить эту проблему, я не ищу больше 10-15px пространства между моими коробками.
Изображение того, как это выглядит сейчас: 
Это мой HTML:
<div class="row">
@foreach (var Site in Model)
{
<a target="_blank" href="@Site.Url">
<div class="col-sm-4 col-style-3">
<img class="CasinoImage" src="~/Content/Img/@Site.ImageName" />
<h2>@Site.Name</h2>
<hr />
<h3>Denne side tilbyder:</h3>
<span class="OfferStyle">
@Site.Bonuses
</span>
<hr />
<div class="ClickMeBox">Hent din bonus nu</div>
@if (@Site.DepositRequired == true)
{
<span class="DepositStyle">INDBETALING ER NØDVENDIGT</span>
}
else
{
<span class="DepositStyle">INGEN INDBETALING NØDVENDIGT!</span>
}
</div>
</a>
}
</div>
Это мой стиль:
.col-style-3 {
padding: 0px !important;
background-color: #fff;
border: solid 1px #e0e0e0;
border-radius: 5px;
text-align: center;
color: #000;
transition: 0.5s;
}
.col-style-3 > a {
color: #FFFFFF;
text-decoration: none;
}
.col-style-3:hover {
border: solid 1px #bebebe;
box-shadow: 0 5px 10px #adadad;
transition: 0.3s;
}