Как абсолютно позиционировать базовую линию текста в HTML
Я озадачен следующей проблемой. Я хочу (абсолютно) расположить базовую линию некоторого фрагмента текста HTML по определенной координате y, в то время как текст должен начинаться с определенной координаты x. Следующая диаграмма ясно демонстрирует проблему.
Поэтому я в основном хочу контролировать, где точка (x, y), которая в дальнейшем называется «базовой точкой», на диаграмме расположена на экране относительно верхнего левого угла BODY документа или некоторого DIV. Важно: я не знаю заранее, каково семейство шрифтов или размер шрифта текста. Это важно, потому что я не хочу менять все позиции в моем CSS всякий раз, когда я меняю шрифты.
В следующем коде я пытаюсь расположить базовую точку в (200,100), но вместо этого она позиционирует верхний левый угол DIV в этой точке.
<html>
<style>
BODY
{
position: absolute;
margin: 0px;
}
#text
{
position: absolute;
top: 100px;
left: 200px;
font-family: helvetica, arial; /* may vary */
font-size: 80px; /* may vary */
}
</style>
<body>
<div id="text">css=powerful</div>
</body>
</html>
Так как мне изменить этот код? Должен ли я использовать свойство вертикального выравнивания окружающего DIV? (Я пытался, но не смог получить желаемый результат).
Спасибо за любые полезные ответы.