Help | Site Map
Connecting Tech Pros Worldwide
 
 
LinkBack Thread Tools
  #1  
Old July 21st, 2005, 12:54 AM
abro
Guest
 
Posts: n/a
Default Separate text alignment within list item (<li>)

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
  #2  
Old July 21st, 2005, 12:54 AM
Harlan Messinger
Guest
 
Posts: n/a
Default Re: Separate text alignment within list item (<li>)


"abro" <bs_jojo22@hotmail.com> wrote in message
news:237a148f.0409291251.33a8968a@posting.google.c om...[color=blue]
> 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).[/color]

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>?

  #3  
Old July 21st, 2005, 12:54 AM
Neal
Guest
 
Posts: n/a
Default Re: Separate text alignment within list item (<li>)

On Wed, 29 Sep 2004 16:55:11 -0400, Harlan Messinger
<h.messinger@comcast.net> wrote:
[color=blue]
> Besides--you *do* know that <li> doesn't go inside <div>?[/color]

Sure it can - supposing there's an intervening ul or ol.
  #4  
Old July 21st, 2005, 12:54 AM
abro
Guest
 
Posts: n/a
Default Re: Separate text alignment within list item (<li>)

"Harlan Messinger" <h.messinger@comcast.net> wrote in message news:<2s0lpgF1fsrg8U1@uni-berlin.de>...[color=blue]
> "abro" <bs_jojo22@hotmail.com> wrote in message
> news:237a148f.0409291251.33a8968a@posting.google.c om...[color=green]
> > 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).[/color]
>
> This *is* a table, so there's no need for pretending it's a list or using a
> CSS alternative.[/color]

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?
[color=blue]
>
> Besides--you *do* know that <li> doesn't go inside <div>?[/color]

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.
 

Bookmarks

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are Off
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over network members.
Post your question now . . .
It's fast and it's free

Popular Articles