text after list item

Howdy -
I have a question that's been nagging me for a few days.
I'm working on a nav bar that uses some mootools effects, but it's not doing exactly what I want it to do.
Here's the skinny:
I have a list with menu options, one under the other. The effect is working (almost) perfectly and is set up simply as:
<ul>
<li>blah</li>
<li>blah 2</li>
...
</ul>
where "blah" is displayed inside of my list element but I would like to have it show up on the outside of the list. Hard to explain in words so here's a picture:



Thanks!!

 

You could define a width for the li if you haven't already, and then add text-indent: #px to it to push the text to the right. Hope that does it for ya.

 

Thanks Rikun! Your advice yielded some progress but it's still not quite there.
This is what happens now:

 

How about use nexted list? you only need to add some styles to it.

<ul>
.. <li>
..... <ul>
......... <li>
........ </li>
..... </ul>
.. </li>
.. <li>
..... <ul>
......... <li>
........ </li>
..... </ul>
.. </li>
.. <li>
..... <ul>
......... <li>
........ </li>
..... </ul>
.. </li>
</ul>

 

Set the margins of the li and position of background image .
It needs some css knowledge .

 

Thanks justinlorder -
I'm not using a BG image - it's just a rectangle. Though I haven't been able to accomplish my vision yet, I am close. I did aligned the text to the right and it looks almost as good as I want it so it may have to do for now until I figure it out.
Thanks again for all the helps!