How to absolutely position the baseline of text in HTML

Question

I\'m puzzled by the following problem. I wish to (absolutely) position the baseline of some piece of HTML text at a certain y-coordinate, while the text should be starting a

Answer 1

Try this :

HTML :

 

 
css=powerful

CSS :

    BODY
{
    position: absolute;
    margin: 0px;
}
#text
{
    position: relative;
    margin-top:-0.938em;
    left:0px;
    font-family: helvetica, arial;
    font-size: 80px;

    /*You can remove this*/
    background: yellow;
    opacity: 0.5;

}
#text-holder
{
    position: absolute;
    height: 200px;
    left: 200px;
}

#text-holder-position {
    position: relative;
    height: 200px;
    width: 200px;
    background: green;
}

#heightJudger {
    position:absolute;
    height:200px; width:200px;
    background:red;
    top:0; left:0;
}

if you want to change the position, change the "height" and the "left" parameters of the #text-holder This way you will be able to control your basepoint position. I put the height judger and some color so you can see if it's what you exepct.

EDIT : Changed the #text margin unit to em. JSFiddle