CSS: выравнивание текста по элементу с помощью встроенного блока отображения

0

У меня есть короткий текст, рядом с которым я должен поставить ссылку. Ссылка не должна отображаться как текст, а как изображение. Пока нет проблем, однако для использования изображения я должен установить display:inline-block чтобы можно было установить ширину/высоту тега. Как только я это сделаю, следующий, который рядом с справа, прыгнет вниз в содержащем div. Я абсолютно неспособен переместить его вверх. Код:

<div>
    <p id="pid">Some prefixing text that shouldn't be at the bottom of the div but rather in the middle <a href="#" target="_blank">This is some link</a></p>
</div>

#pid {
    border: 1px solid blue;
    float: right;
}
#pid a {
    display: inline-block;
    width: 50px;
    height: 53px;
}

http://jsfiddle.net/DxVQr/1/

Итак, как я мог переместить текст префикса вверх? Большое спасибо!

  • 0
    Вы говорите: «Ссылка должна отображаться не как текст, а как изображение». а у тебя есть текст ??
  • 0
    У меня есть текст, чтобы продемонстрировать, о чем я говорю. В примере нет необходимости в изображении, поскольку оно будет вести себя точно так же.
Показать ещё 6 комментариев
Теги:
alignment
vertical-alignment

1 ответ

0
Лучший ответ

vertical-align: middle на теге <a> выполняет работу?

  • 0
    Неплохо для экстренного решения. Есть ли способ, как его выровнять точнее? На изображении будет тень, поэтому текст должен подняться примерно на 25% высоты изображения.
  • 0
    Ну, я могу на самом деле установить% в вертикальном выравнивании, поэтому, если я установлю его в минус, это должно сделать трюк ...
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню