Как выровнять иконку с fontawesome?

Question

[Rufix]

Поставил 2 иконки с fontawesome в "слайдер фото" и мне нужно, чтобы они стояли на одном уровне. Помогите)
Вот скрин: https://imgur.com/a/2zqEN
На padding и margin иконки никак не реагируют.. они стоят как вкопаные на своем месте.

Comments

[Дмитрий]

Ссылку или код скиньте.

[Rufix]

Дмитрий Полянский, код html:

<div class="row">
			<div class="col-lg-12">
				<div class="faces">
					<i class="fa fa-chevron-left faces__icon"></i>
					<img src="img/face2.png" alt="face" class="faces__img">
					<img src="img/face3.png" alt="face" class="faces__img">
					<img src="img/face.png" alt="face" class="faces__img">
					<img src="img/face4.png" alt="face" class="faces__img">
					<img src="img/face5.png" alt="face" class="faces__img">
					<i class="fa fa-chevron-right faces__icon"></i>
				</div>
			</div>
		</div>

код css:

.faces__img{
	margin-top:32px;
	padding: 13px;
}

.faces__icon{
	padding: 10px;
	font-size:20px;
}

[Dymok]

Rufix, попробуйте иконку обернуть в контейнер и ему задавать отступы

[Rufix]

UnluckySerivelha, что-то из этого получилось, но теперь иконки под картинками. каша в голове, не могу понять как выравнять:)
вот скрин: https://imgur.com/a/EHSYV

вот html код
:

<div class="row">
			<div class="col-lg-12">
				<div class="faces">
					<img src="img/face2.png" alt="face" class="faces__img">
					<img src="img/face3.png" alt="face" class="faces__img">
					<img src="img/face.png" alt="face" class="faces__img">
					<img src="img/face4.png" alt="face" class="faces__img">
					<img src="img/face5.png" alt="face" class="faces__img">
				</div>
				<div class="faces__icons">
					<i class="fa fa-chevron-left faces__icon"></i>
					<i class="fa fa-chevron-right faces__icon"></i>
				</div>
			</div>
		</div>

вот css код

.faces__img{
	margin-top:32px;
	padding: 13px;
}

.faces__icon{
	padding: 10px;
	font-size:20px;
	padding-left: 250px;
	padding-right: 250px; 
}

[Ольга Ветер]

Загляните в инспектор. Сейчас новый fontawesomeтакой чудной... возможно вам нужно обращаться к
.faces svg { отступы, размеры... }

[Дмитрий]

.faces:before {
content: "\f053";
font-family: Fontawesome;}
.faces:after {
content: "\f054";
font-family: Fontawesome;}

такой вариант еще есть.Дальнейшая "оцентровка" флексом или гридом.

Answer 1

[Ilya muromtsev]

может попробовать display: flex?

Comments

[Rufix]

а к чему это применить? Я просто этим не пользовался ни разу:)

[Ilya muromtsev]

Rufix, Ну вот, например для кнопки с иконкой и названием можно прописать это свойство и выравнить как угодно, а вот в вашем случае хотя бы посмотреть код и уже смотреть куда что писать))

[Rufix]

Ilya muromtsev, код я скинул выше, там где 5 комментариев

Answer 2

[NaN]

https://habrahabr.ru/company/netcracker/blog/277433/