Вертикальное центрирование текста в div
https://satoshifaucet.com/satoshindex
Я пытаюсь расположить текст по центру внутри 4-х делителей, используя sat, bit, mBTC и BTC. Я пытался делать
display:table-cell;
vertical-align:middle;
на divs, но это не работает. Любая помощь будет оценена. Также страница загружается медленно, по какой-то причине, должны быть все запросы API, но я не уверен. Просто https://satoshifaucet.com/ загружается быстро.
2 ответа
Решение
Как показывает комментарий макшх line-height
будет достаточно:
.smallUnitBox {
background-color: #29b8ff;
border-right: 2px solid #2098d4;
float: left;
height: 36px;
width: 96px;
line-height: 36px;
color: white;
font-size: 28px;
font-family: sans-serif;
border-bottom: 1px solid #2098d4;
}
<div class="unitBox">
<div class="smallUnitBox">sat</div>
<div class="smallUnitBox">bit</div>
<div class="smallUnitBox">mBTC</div>
<div class="smallUnitBox">BTC</div>
</div>
Не забудьте удалить, так как это не нужно:
display:table-cell;
vertical-align:middle;
Он означает высоту строки. Вы всегда можете добавить padding-top.