Имеется вот такой контейнер. Как выровнять его содержимое по центру?
В bootstrap есть тег center-top
. Я его пробовал по разному применять, но нужного результата он мне не дал. Код ниже.
@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css');
.top-cover {
width: 100px;
height: 100px;
background-color: black;
margin-right: 10px;
margin-top: 15px;
}
.top-name {
display: block;
width: 100px;
max-height: 40px;
overflow: hidden;
}
<div class="container bgcont center-block">
<div class="row background-row">
<div class="centered-top">
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6"><div class="top-cover"></div><p class="text-center top-name">Oxxxymiron - Город под подошвой</p></div>
</div>
</div>
</div>
<div class="col-lg-2 col-md-3 col-sm-3 col-xs-6 text-center">
может поможет, а может и нет, без css стилей внутренних элементов трудно сказать