Benim düzen şu anda bu gibi görünüyor

Ortadaki sütun, Server Her Div arasında küçük bir marj eklemek istiyorum. Ama, eğer CSS marjı eklerseniz, satır ve bu şekilde sarma bitiyor

<div class="row info-panel">
    <div class="col-md-4 server-action-menu" id="server_1"><div>Server 1</div></div>
    <div class="col-md-4 server-action-menu" id="server_2"><div>Server 2</div></div>
    <div class="col-md-4 server-action-menu" id="server_3"><div>Server 3</div></div>
    <div class="col-md-4 server-action-menu" id="server_4"><div>Server 4</div></div>
    <div class="col-md-4 server-action-menu" id="server_5"><div>Server 5</div></div>
    <div class="col-md-4 server-action-menu" id="server_6"><div>Server 6</div></div>
    <div class="col-md-4 server-action-menu" id="server_7"><div>Server 7</div></div>
</div>

Ve CSS

.server-action-menu {
    background-color: transparent;
    background-image: linear-gradient(to bottom, rgba(30, 87, 153, 0.2) 0%, rgba(125, 185, 232, 0) 100%);
    background-repeat: repeat;
    border-radius:10px;
}

.info-panel {
    padding: 4px;
}

Bunu yaparak kenar boşlukları eklemek için çalıştı

.info-panel  > div {
    margin: 4px;    
}

Nasıl sağ tarafta çok fazla boşluk bırakın. - DİVs için bir marj ekleyebilir miyim?

Marjı ile iç kap yerine dolgu ile çalışmalısın. Bu deneyin!

HTML

<div class="row info-panel">
    <div class="col-md-4" id="server_1">
       <div class="server-action-menu">
           Server 1
       </div>
   </div>
</div>

CSS

.server-action-menu {
    background-color: transparent;
    background-image: linear-gradient(to bottom, rgba(30, 87, 153, 0.2) 0%, rgba(125, 185, 232, 0) 100%);
    background-repeat: repeat;
    border-radius:10px;
    padding: 5px;
}