Выравнивание по вертикали некоторого текста в блочном <a> теге

StackOverflow https://stackoverflow.com/questions/2448667

Вопрос

Мне нужен css-gunu, который помог бы мне с этим.Справа у меня есть тег a, который представляет собой блочный элемент фиксированной ширины и высоты.Внутри него находится фоновое изображение и заголовок изображения.Я пытаюсь выровнять текст по низу, но у меня ничего не получается.Я пытался сделать отобразить:таблица-ячейка;выравнивание по вертикали:снизу;и самыми разными способами.Но это ни к чему не приведет.Я знаю, что я мог бы увеличить высоту строки, но у этого есть эта странная пунктирная линия вокруг элемента.Просто попробовал установить интервал с текстом в нем внутри тега a и выровнять его по вертикали, но безрезультатно, хотя подчеркивание переместилось в низ.Что странно!Любая помощь очень ценится.Ричард

Это было полезно?

Решение

Родительский элемент нуждается в отображении: таблица, а затем элемент, который вы хотите внизу, имеет отображение: таблица-ячейка;выровнять: снизу;

Другие советы

На какие браузеры вы ориентируетесь?Это отлично работает для меня в IE8.0.6 и FireFox 3.5.8:

<a style="display:block;height:200px;width:200px;background:blue;display:table-cell;vertical-align:bottom;">This is a test</a>

Обратите внимание, что я использовал оба варианта display:table-cell; и vertical-align:bottom;.Они тебе нужны оба;не был уверен, пробовали ли вы это.

Если это доставляет вам проблемы (вы ориентируетесь на IE6?) вам придется разместить свой <a> элемент в элементе уровня блока, а затем расположите его.

<div style="position:relative;top:0px;left:0px;height:200px;width:200px;background:yellow;">
    <a style="position:absolute;bottom:0px;">Your text</a>
</div>
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top