Come inserire una line di divisione tra i blocchi grid di bootstrap

By admin, 3 November, 2016
Versione Drupal
Drupal 7.x

Un piccolo esempio di CSS per inserire una riga verticale di divisione tra colonne bootstrap

.row.vertical-divider {
  overflow: hidden;
}
.row.vertical-divider > div[class^="col-"] {
  text-align: center;
  padding-bottom: 100px;
  margin-bottom: -100px;
  border-left: 1px solid #F4F4F4;
  border-right: 1px solid #F4F4F4;
}
.row.vertical-divider div[class^="col-"]:first-child {
  border-left: none;
}
.row.vertical-divider div[class^="col-"]:last-child {
  border-right: none;
}

 

<link href="http://getbootstrap.com/dist/css/bootstrap.min.css" rel="stylesheet" />
<div class="row vertical-divider">
  <div class="col-xs-6">Blocco 1</div>
  <div class="col-xs-6">Blocco 2</div>
</div>