[SOLVED] a span alignment

[pesho318i]

hey

I'd like to get an unordered list of the form:

Code: Select all

 
* item_1                 3
* item_2                23
* item_3                 6
* item_4               234

My code is something of the sort:

Code: Select all

<ul>
   <li>
      <span style="width=200px">item_1</span>
      <span>3</span>
   </li>
   ...........
</ul>

instead of the style="....." I have css classes.
However, the layout I get is:

* item_1 3
* item_2 26
* item_3 6
* item_4 234

Obviously, it doesn't recognize the span width.
Do you have any idea why it could be so????
... and how I could fix it.

thanks,
P

[karinne]

Hmmm ... set a width for the li, then float the first span left and float the other span right.

That might work.

[pesho318i]

hm, then the numbers go to the right, but fall on the next line (below)
I'm afraid that some of the style attributes may be inherited from higher-order tags and therefore I get this strange result.

Do I have to add anything else except for the width to overcome overriding of a (important) attribute in my case?

thanks!

[dab42pat]

not sure if this is what you are after but this seems to work.

HTML: Select all

<ul>
   <li>
      item_1<span style="margin-left:200px;">
      3</span>
   </li>
   ...........
</ul>

[Stuart]

The above ^ is maybe not the best way, but the idea is good. If you put the number into a span like dab42pat did, and use CSS to push that span to the right, you should get the desired effect.

[MikeHopley]

Originally Posted by pesho318i

I'd like to get an unordered list of the form:

Code: Select all

 
* item_1                 3
* item_2                23
* item_3                 6
* item_4               234

Um...

That's not an unordered list; it's an unordered table.

Why not use a <table>?

[pesho318i]

yup, in the end I fixed it using table...

thanks

[welshstew]

thread marked as solved