Question

How can I achieve this view with CSS:

——————TITLE

or

TITLE——————

I have

<div id="titleBlock">
   <div id="title">Some text</div>
   <div id="titleLine"></div>
</div>

And my styles are:

#titleLine {
    border-top: 1px solid black;
    width: 84%;
    clear: both;
    height: 20px;
}

#title {
    height: 10px;
    float: right;
}

My approach is here: jsFiddle

However the line width is defined with percents and I need it adjust automatically with CSS.

Answer 1

This may be what you are after: http://jsfiddle.net/XpSWX/1/