@fenucss

Как расположить иконки по центру в bootstrap?

Не получается расположить иконки по центру экрана. Offset не вариант, margin: 0 auto не срабатывает. Буду благодарен за помощь.
<div id="header" class="container-fluid">
		<div class="row">
			<div class="col-xs-offset-2 top_menu_row1">
				<div class="col-xs-4 col-sm-4 top_menu_icon1 top-menu-icon-all">
					<div class="text_icon_name">Brands</div>
				</div>
				<div class="col-xs-4 col-sm-4 top_menu_icon2 top-menu-icon-all">
					<div class="text_icon_name">Education</div>
				</div>
				<div class="col-xs-4 col-sm-4 top_menu_icon3 top-menu-icon-all">
					<div class="text_icon_name">Categories</div>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col-xs-offset-2 top_menu_row2">
				<div class="col-xs-4 col-sm-4 top_menu_icon4 top-menu-icon-all">
					<div class="text_icon_name">Books</div>
				</div>
				<div class="col-xs-4 col-sm-4 top_menu_icon5 top-menu-icon-all">
					<div class="text_icon_name">E-books</div>
				</div>
				<div class="col-xs-4 col-sm-4 top_menu_icon6 top-menu-icon-all">
					<div class="text_icon_name">Trending</div>
				</div>
			</div>
		</div>

.top_menu_icon1, .top_menu_icon2, .top_menu_icon3, .top_menu_icon4, .top_menu_icon5, .top_menu_icon6{
	background: url(../img/drawable-ldpi/sprites.png) no-repeat;
}

.top_menu {
	display: inline-block;
	position: relative;
}

.top-menu-icon-all {
	width: 36px;
	height: 36px;
	padding-bottom: 50px;
	padding-right: 65px;
	cursor: pointer;
	z-index: 100;
	position: relative;
}

.top_menu_icon1{
	background-position: -208px -56px ;	
}

.top_menu_icon2{
	background-position: -307px -56px ;
}

.top_menu_icon3{
	background-position: -407px -57px ;
}

.top_menu_icon4{
	background-position: -209px -107px ;
}

.top_menu_icon5{
	background-position: -308px -108px ;
}

.top_menu_icon6{
	background-position: -407px -108px ;
}
  • Вопрос задан
  • 365 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы