Как разместить текст по центру изображения?

Question

Я пытаюсь разместить текст поверх изображения кнопки. Мне удается выровнять его по центру слева направо на кнопке, но вертикальное выравнивание не помогает в остальном. Есть ли способ в CSS, чтобы иметь возможность центрировать этот текст по вертикали.

.selectedTabOnPlacementMenu
{
    background: url('/Content/Images/Blank_Yellow.png') no-repeat;
    width:88px;
    height:28px;
    text-align:center;
    font-weight:bold;
}

Answer 1

Если это одна строка текста, вы можете установить высоту строки.

<div style="height:50px;background-color:#ccc;">
    <p style="line-height:50px;">test</p>
</div>

Гораздо сложнее вертикально центрировать несколько строк текста.

Answer 2

Просто введите код

line-height:28px;

в вашем классе.

Answer 3

Вы можете использовать margin-top: 5px; или padding-top: 5px; (в зависимости от того, как настроен ваш div) в div, где у вас есть текст, чтобы нажать его вниз.

Приветствия