Различить три строки текста в одном разделе?
Я пытаюсь создать страницу Tumblr здесь, и в области заголовка (так низко, как эта желтая линия), я хочу, чтобы три разных строки текста появлялись в разных местах заголовка, когда он был наведен. Я хочу, чтобы четыре ссылки (Дом через тему) появлялись в верхнем левом углу; "ОБЩАЯ ТЕКСТОВАЯ ЛИНИЯ" в вертикальной и горизонтальной середине; и строка "Обновлено: (Дата)" в правом нижнем углу. Я еще не уверен, сколько текста появится в средней части, но верхняя и нижняя части будут определенно высотой всего в одну строку.
Вот текущий, соответствующий код (я думаю - дайте мне знать, если я должен добавить сюда также фрагменты кода без наведений):
<style>
.desc {
position:absolute;
top: 0; left: 0; right: 0; bottom: 0;
background: #111;
border-bottom: 2px solid #F2CD57;
height:100px;
line-height:100px;
font-family:'georgia';
color:#fff;
opacity:0;
font-style:italic;
transition: all 0.7s ease;
}
.desc .top {text-align:left;vertical-align:top;}
.desc .mid {text-align:center;vertical-align:middle;}
.desc .bot {text-align:right;vertical-align:bottom;}
</style>
<body>
<div class="desc">
<table>
<tr class="top">all the links</tr>
<tr class="mid">text text text</tr>
<tr class="bot">update line</tr>
</table>
</div>
</body>