Вертикальное позиционирование текста внутри блока

[Ser8191]

Уважаемые мастера, подскажите:

div.TempDv{
width:35px;height:35px;
background-position: 50% 50%;
background-repeat:no-repeat;
border: 1px dotted #5698C9;
margin: 60px 0 0 10px;
position: absolute;
background-image:url(prib2.jpg);
text-align: center;
vertical-align: bottom;
}

По горизонтали текст выравнивается, а по вертикали нет.

Нужно чтобы текст был по середине снизу.

[Svetlana_P]

Свойство vertical-align работает только для контейнеров, у которых свойство display имеет значение inline или table-cell. Здесь оно не поможет. Выравнивание сейчас удобно делать через flexbox, советую ознакомиться.

Конкретно в этом примере — блок очень мал для такого текста, 35x35px. Если увеличить его и сделать флексбоксом, то например так https://jsfiddle.net/Benedetta/k1ew6kjo/

[Ser8191]

https://jsfiddle.net/Ser8191/gs5fqxL5/

Я так пробовал, текст по низу, но не по центру

[Svetlana_P]

Пропишите justify-content: center, будет по центру

https://jsfiddle.net/Benedetta/gs5fqxL5/1/

[Ser8191]

Спасибо