I want to center every element of a boostrap row that overflows,for example:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"><div class="row"><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div><div class="col-lg-2"> col-lg-2 </div></div>
So this row has 6 columns and then overflows in 3 columns.I want that the last three columns align in the center, like margin: auto
(see example image). I'd like to use a single style for the row.
Image of what I have now and what I want to achieve: