Имеется текст, сейчас он прилегает к иконке слева, а нужно чтобы текст был прижат вправо, но чтобы свойство text-align
было left
. Как это сделать?
При этом на мобилках предполагается, что эти три колонки будут на всю ширину, тогда лучше, чтобы текст был прижат влево
сейчас так:
нужно так:
.specifications {
display: flex;
flex-direction: row;
width: 500px;
flex-basis: 500px;
}
.specifications__item {
width: 33%;
flex-basis: 33%;
display: flex;
align-items: center;
}
.specifications__item > * {
vertical-align: middle;
}
.specifications__icon {
width: 39px;
flex-basis: 39px;
height: 39px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid black;
}
.specifications__title {
}
.specifications__title span {
}
<div class="specifications">
<div class="specifications__item">
<span class="specifications__icon"></span>
<span class="specifications__title"><span>Бесплатный монтаж</span></span>
</div>
<div class="specifications__item">
<span class="specifications__icon"></span>
<span class="specifications__title"><span>Редуктор давления</span></span>
</div>
<div class="specifications__item">
<span class="specifications__icon"></span>
<span class="specifications__title"><span>Комплект картриджей</span></span>
</div>
</div>
.specifications__title
прописать прижиматься к правой части, а в@media only screen and (max-width: 600px)
прописать.specifications__title
-text-align:left
– Antonio112009 7 ноя '18 в 13:12