Jump to content

Ordered Lists...


Jonas
 Share

Recommended Posts

Does anyone know how to put list items display: inline; and yet have them show the numbers? This is really starting to annoy me...

Link to comment
Share on other sites

I don't think such thing is possible. Changing the display property of an item also turns off the default styling of the browser, thus eliminating the number. Adding list-style wouldn't work either scince list-style is applyed only to list items, not inline elements.If the actual idea is to have the list show in one row, such as1. Foo 2. More foo 3. Big fooYou could use the :before pseudo class, but as we know, it won't work in IE.

Link to comment
Share on other sites

Does anyone know how to put list items display: inline; and yet have them show the numbers? This is really starting to annoy me...

Use float: left; instead of display: inline;heres a quick example.
<html><head><title>example</title><style>ol { float:left; } li { float:left; margin:15px; padding:0; }</style></head><body><ol><li><a href="/1">Link 1</a></li><li><a href="/2">Link 2</a></li></ol></body></html>

Ya like that dont ya. :)

Link to comment
Share on other sites

Don't like that, because it doesn't work. :)

Sure it does did you copy it?The thing you do have to watch out for is the diffrence in margin between IE and FF but you already know that.example101.jpg
Link to comment
Share on other sites

Doesn't work in Opera, which is the browser I use.

AhhhhhYeah I never tested it in Opera I only tested it in Firefox and IE.DamnNa dont know of any other way.
Link to comment
Share on other sites

If the actual idea is to have the list show in one row, such as1. Foo 2. More foo 3. Big fooYou could use the :before pseudo class, but as we know, it won't work in IE.

How could you use the :before pseudo class actually? I know how to do it with one sign or something, but for the number (and the :before content) to change for each element? I don't know how that would work.
Link to comment
Share on other sites

would it be too much trouble some to just add the numbers in there manually?

Link to comment
Share on other sites

would it be too much trouble some to just add the numbers in there manually?

It's quite a long list, which is also why I don't want it to use one line for each number... :|
Link to comment
Share on other sites

How could you use the :before pseudo class actually? I know how to do it with one sign or something, but for the number (and the :before content) to change for each element? I don't know how that would work.

I was starting to ask myself this the second I posted this post, but then again, I saw the CSS2.1 specification, which I think holds the plausable answer. However I have no idea which browsers support the needed content values. Look at the content property for starters. There, you'll also find the counter function.As for the odd behaviour of Opera... could it be a browser bug? Should we report it to Opera (I have the latest build of Opera 9 beta and the bug still exists, so who knows...).
Link to comment
Share on other sites

i've been following the discussion thread because I've been trying to do the same thing myself.the code johneva posted worked fine for me in firefox but when i opened the page in i.e, the list displayed inline but the numbers weren't there. it's i.e. 6 bty.is there something i'm missing?

Link to comment
Share on other sites

Na your right I just did not test it properly in all browsers. :)

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...