Welcome to WebmasterWorld Guest from 23.22.220.37

Forum Moderators: not2easy

Message Too Old, No Replies

making things line up neatly

without using a table

     
5:52 am on Feb 5, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Jan 21, 2002
posts:977
votes: 0


Hi,

I want to make a vertical list of words, each with a small arrow graphic to the right, kind of like this (but without the dots):

Pineapple.> 
Grape.....>
Banana....>

As you can see, I'd like all the arrow graphics to be in line with each other.

This whole thing sits in a div. I won't know the width because I won't know what words will go in the list because it'll be dynamically generated. That means I can't set the width of a span to line up the arrows.

I could just use a table to line up the arrows, but I don't want to because it's not tabluar data - so is there a CSS trick to do this?

6:23 am on Feb 5, 2004 (gmt 0)

Junior Member

10+ Year Member

joined:Aug 24, 2003
posts:175
votes: 0


If the arrows are imgs, float them to the right.

#favoritefruits img {float: right; }

adam

3:30 am on Feb 6, 2004 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Jan 21, 2002
posts:977
votes: 0


Yes the arrows are images, and using float was a good idea, but unfortunately it made the div go to 100% wide with the arrows waaaaaaay over on the right. I feel like there must be a simple answer and I'll kick myself when I see it, but I just can't think of it.
5:21 am on Feb 6, 2004 (gmt 0)

Senior Member from CA 

WebmasterWorld Senior Member 10+ Year Member

joined:Nov 25, 2003
posts:889
votes: 56


<edited to remove post: missed the "unKnown-width" requirement.>