CSS: Выравнивание содержимого блоков по вертикали

05.03.2021 Павел Грибов WEB

Чтобы получилось нечто подобное:

HTML:

    <div class="tile2">
        <div class="icons_left"><img height="32px" src="/images/list.png"></div>
        <div class="icons_right" ><img height="32px" src="/images/heart.png"></div>
    </div>

</div>

CSS:

.tile2{
    grid-template-columns: 50% 50%;
    display: flex;
    height: 100%;    
}
.tile2>.icons_left {
    color: #003264;
    font-weight: bold;
    font-size: xx-large;
    text-align: end;
    margin:  auto;
    cursor: pointer;
} 
.tile2>.icons_right {
    color: #003264;
    font-weight: bold;
    font-size: xx-large;
    text-align: left;
    margin:  auto;
    cursor: pointer;
}

.tile2{

grid-template-columns: 50% 50%;

display: flex;

height: 100%;

}

.tile2>.icons_left {

color: #003264;

font-weight: bold;

font-size: xx-large;

text-align: end;

margin: auto;

cursor: pointer;

}

.tile2>.icons_right {

color: #003264;

font-weight: bold;

font-size: xx-large;

text-align: left;

margin: auto;

cursor: pointer;

}

Оставить комментарий css, vertical-alling, выравнивание по вертикали

Пн	Вт	Ср	Чт	Пт	Сб	Вс
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30

CSS: Выравнивание содержимого блоков по вертикали

Добавить комментарий Отменить ответ