Separate text alignment within list item (<li>)

[abro]

Problem:
A list contained in a div contains several items that are made of two
parts: itemName and itemValue.

ie:

<div id="data">
<li>longtime1 <span> 1326 mins></span></li>
<li>longtime2 <span> 1692 mins</span></li>
<li> time1 <span> 24 mins </span></li>
<li> time2 <span> 1 min </span></li>
<li> time3 <span> 4 mins </span></li>
<li> time4 <span> 0 mins </span></li>
<div>

Is it possible (using css) to right align the itemValues while at the
same time left align the itemNames? I was unsuccessful with the below
CSS. Of course there is the alternative of using an html table but I
wanted to see the CSS alternative (if one exists).

#data ul {
list-style-type: none;
margin: 0px 0px 0px 0px;
}
#data ul li {
font-size: .75 em;
text-align: left;
}
#data ul li span {
margin-right: 0px;
}

Thanks for any input:
Abro

[Harlan Messinger]

"abro" <bs*******@hotm ail.com> wrote in message
news:23******** *************** ***@posting.goo gle.com...

Problem:
A list contained in a div contains several items that are made of two
parts: itemName and itemValue.

ie:

<div id="data">
<li>longtime1 <span> 1326 mins></span></li>
<li>longtime2 <span> 1692 mins</span></li>
<li> time1 <span> 24 mins </span></li>
<li> time2 <span> 1 min </span></li>
<li> time3 <span> 4 mins </span></li>
<li> time4 <span> 0 mins </span></li>
<div>

Is it possible (using css) to right align the itemValues while at the
same time left align the itemNames? I was unsuccessful with the below
CSS. Of course there is the alternative of using an html table but I
wanted to see the CSS alternative (if one exists).

This *is* a table, so there's no need for pretending it's a list or using a
CSS alternative.

Besides--you *do* know that <li> doesn't go inside <div>?

[Neal]

On Wed, 29 Sep 2004 16:55:11 -0400, Harlan Messinger
<h.*********@co mcast.net> wrote:

Besides--you *do* know that <li> doesn't go inside <div>?

Sure it can - supposing there's an intervening ul or ol.

[abro]

"Harlan Messinger" <h.*********@co mcast.net> wrote in message news:<2s******* ******@uni-berlin.de>...

"abro" <bs*******@hotm ail.com> wrote in message
news:23******** *************** ***@posting.goo gle.com...

Problem:
A list contained in a div contains several items that are made of two
parts: itemName and itemValue.

ie:

<div id="data">
<li>longtime1 <span> 1326 mins></span></li>
<li>longtime2 <span> 1692 mins</span></li>
<li> time1 <span> 24 mins </span></li>
<li> time2 <span> 1 min </span></li>
<li> time3 <span> 4 mins </span></li>
<li> time4 <span> 0 mins </span></li>
<div>

Is it possible (using css) to right align the itemValues while at the
same time left align the itemNames? I was unsuccessful with the below
CSS. Of course there is the alternative of using an html table but I
wanted to see the CSS alternative (if one exists).
This *is* a table, so there's no need for pretending it's a list or using a
CSS alternative.

Thank you Harlan for your comments.
You didn't entirely address my 'Is it possible' question? Which are
you saying:

A) No it is not possible. Use a table.
B) Yes it is possible, but 'incorrect'. Use a table.

If the answer is B.. is there anyone out there that is willing to tell
me how to do it without a table?

Besides--you *do* know that <li> doesn't go inside <div>?

I assume you are pointing out that I forgot to properly close the div
tag above </div> as well as include <ul></ul>. Both are a typo in the
posting (not my actual code :)). I appreciate the clarification. One
other aside, I removed other non-list elements from the div for my
post since they didn't relate to the question at hand. Those other
non-posted elements justify wrapping the list in a div as all of the
elements (including the list) are presentation related.