Connecting Tech Pros Worldwide Help | Site Map

float a SPAN to the right in a LI

  #1  
Old October 13th, 2008, 07:15 PM
asc4john
Guest
 
Posts: n/a
I have <ul<liitem text <spancount </span</li><liitem text
<spancount </span</li</ul>
I want the span to right in the LI, but when I use float:right on the
SPAN it winds-up appearing in the next LI in the list, and the last
SPAN appears outside the list. The SPANs appear in the correct place
in the horizontal, but down "one" in the vertical. How to do it
correctly?
  #2  
Old October 13th, 2008, 07:55 PM
Kevin Scholl
Guest
 
Posts: n/a

re: float a SPAN to the right in a LI


On Oct 13, 2:10*pm, asc4john <j...@kinnear.cawrote:
Quote:
I have <ul<liitem text <spancount </span</li><liitem text
<spancount </span</li</ul>
I want the span to right in the LI, but when I use float:right on the
SPAN it winds-up appearing in the next LI in the list, and the last
SPAN appears outside the list. The SPANs appear in the correct place
in the horizontal, *but down "one" in the vertical. How to do it
correctly?
Generally speaking, floats have to ... hmmm, how to say this ... come
BEFORE the element they are floating against. So in your case, you
want the floated SPAN to go to the right of the base text within the
LI. So:

<ul>
<li><span>count</spanitem text</li>
<li><span>count</spanitem text</li>
<li><span>count</spanitem text</li>
</ul>

If you want to maintain the "item text - count" ordering in the event
that the user doesn't have style sheets, you could set the text-
alignment of the LI to "right", then span the item text and float it
"left", thusly:

<ul>
<li><span>item text</spancount</li>
<li><span>item text</spancount</li>
<li><span>item text</spancount</li>
</ul>
  #3  
Old October 13th, 2008, 08:05 PM
asc4john
Guest
 
Posts: n/a

re: float a SPAN to the right in a LI


On Oct 13, 12:50*pm, Kevin Scholl <ksch...@comcast.netwrote:
Quote:
On Oct 13, 2:10*pm, asc4john <j...@kinnear.cawrote:
>
Quote:
I have <ul<liitem text <spancount </span</li><liitem text
<spancount </span</li</ul>
I want the span to right in the LI, but when I use float:right on the
SPAN it winds-up appearing in the next LI in the list, and the last
SPAN appears outside the list. The SPANs appear in the correct place
in the horizontal, *but down "one" in the vertical. How to do it
correctly?
>
Generally speaking, floats have to ... hmmm, how to say this ... come
BEFORE the element they are floating against. So in your case, you
want the floated SPAN to go to the right of the base text within the
LI. So:
>
<ul>
* <li><span>count</spanitem text</li>
* <li><span>count</spanitem text</li>
* <li><span>count</spanitem text</li>
</ul>
>
If you want to maintain the "item text - count" ordering in the event
that the user doesn't have style sheets, you could set the text-
alignment of the LI to "right", then span the item text and float it
"left", thusly:
>
<ul>
* <li><span>item text</spancount</li>
* <li><span>item text</spancount</li>
* <li><span>item text</spancount</li>
</ul>
aah, never thought of that, thanks you
  #4  
Old October 13th, 2008, 08:05 PM
Kevin Scholl
Guest
 
Posts: n/a

re: float a SPAN to the right in a LI


On Oct 13, 2:58*pm, asc4john <j...@kinnear.cawrote:
Quote:
On Oct 13, 12:50*pm, Kevin Scholl <ksch...@comcast.netwrote:
>
>
>
Quote:
On Oct 13, 2:10*pm, asc4john <j...@kinnear.cawrote:
>
Quote:
Quote:
I have <ul<liitem text <spancount </span</li><liitem text
<spancount </span</li</ul>
I want the span to right in the LI, but when I use float:right on the
SPAN it winds-up appearing in the next LI in the list, and the last
SPAN appears outside the list. The SPANs appear in the correct place
in the horizontal, *but down "one" in the vertical. How to do it
correctly?
>
Quote:
Generally speaking, floats have to ... hmmm, how to say this ... come
BEFORE the element they are floating against. So in your case, you
want the floated SPAN to go to the right of the base text within the
LI. So:
>
Quote:
<ul>
* <li><span>count</spanitem text</li>
* <li><span>count</spanitem text</li>
* <li><span>count</spanitem text</li>
</ul>
>
Quote:
If you want to maintain the "item text - count" ordering in the event
that the user doesn't have style sheets, you could set the text-
alignment of the LI to "right", then span the item text and float it
"left", thusly:
>
Quote:
<ul>
* <li><span>item text</spancount</li>
* <li><span>item text</spancount</li>
* <li><span>item text</spancount</li>
</ul>
>
aah, never thought of that, thanks you
Welcome. :-)
  #5  
Old October 13th, 2008, 10:55 PM
dorayme
Guest
 
Posts: n/a

re: float a SPAN to the right in a LI


In article
<5abddc93-0536-482c-b4fa-7cbcce7f8fbe@1g2000prd.googlegroups.com>,
Kevin Scholl <kscholl@comcast.netwrote:
Quote:
On Oct 13, 2:10*pm, asc4john <j...@kinnear.cawrote:
Quote:
I have <ul<liitem text <spancount </span</li><liitem text
<spancount </span</li</ul>
I want the span to right in the LI, but when I use float:right on the
SPAN it winds-up appearing in the next LI in the list, and the last
SPAN appears outside the list. The SPANs appear in the correct place
in the horizontal, *but down "one" in the vertical. How to do it
correctly?
>
Generally speaking, floats have to ... hmmm, how to say this ... come
BEFORE the element they are floating against. So in your case, you
want the floated SPAN to go to the right of the base text within the
LI. So:
>
<ul>
<li><span>count</spanitem text</li>
<li><span>count</spanitem text</li>
<li><span>count</spanitem text</li>
</ul>
>
If you want to maintain the "item text - count" ordering in the event
that the user doesn't have style sheets, you could set the text-
alignment of the LI to "right", then span the item text and float it
"left", thusly:
>
<ul>
<li><span>item text</spancount</li>
<li><span>item text</spancount</li>
<li><span>item text</spancount</li>
</ul>
But watch for fun and games with bullets in different browsers if you do
this last! Perhaps best turn bullets off so the problem does not appear.

--
dorayme
  #6  
Old October 14th, 2008, 10:05 AM
robert.jalarvo@gmail.com
Guest
 
Posts: n/a

re: float a SPAN to the right in a LI


On 13 loka, 20:50, Kevin Scholl <ksch...@comcast.netwrote:
Quote:
Generally speaking, floats have to ... hmmm, how to say this ... come
BEFORE the element they are floating against. So in your case, you
want the floated SPAN to go to the right of the base text within the
Great, thanks!
Closed Thread


Similar Threads
Thread Thread Starter Forum Replies Last Post
How do I get these 2 divs to be side by side ? jeddiki answers 2 January 31st, 2009 05:00 PM
Hi, every one, anchor tag in li tag is problem, pls see it praveenb000 answers 1 September 6th, 2008 06:10 AM
float:right goes to next line ashkaan57@hotmail.com answers 22 January 14th, 2007 07:55 PM
Can't get my clear to work, would really appreciate it if someone would review my code! laurakr@gmail.com answers 1 August 3rd, 2006 06:45 AM