PDA

View Full Version : Reverse lists???



finstah1
Mar 14th, 2007, 08:01 PM
I'm trying to use an ordered list but in reverse, can this be done?

instead of
1
2
3

I want
3
2
1

Excavator
Mar 14th, 2007, 08:20 PM
Hello finstah1,
A list as a horizontal menu floated right will reverse the order of the markup. I'm not sure if you can reverse the numbers in a vertical list though...

Here's the properties that are available. (http://www.blooberry.com/indexdot/css/properties/list/lstype.htm)

Antoniohawk
Mar 14th, 2007, 08:55 PM
Pretty hacked together, but it works.

http://paularmstrongdesigns.com/weblog/css/reverse-ordered-lists

finstah1
Mar 14th, 2007, 09:14 PM
neat! that'll work. Thanks!!

Arbitrator
Mar 15th, 2007, 09:35 AM
I'm not sure if you can reverse the numbers in a vertical list though...This is possible using CSS2. The usual browser doesn’t support it though.


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html lang="en-US">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>CF 109834</title>

<meta name="Author" content="Patrick Garies">

<style type="text/css">
* { margin: 0; padding: 0; }
html { padding: 1em; font-family: monospace; }
ol { counter-reset: countdown 6; }
li { display: block; }
li::before { content: counter(countdown) ". "; counter-increment: countdown -1; }
</style>

</head>
<body>

<ol>
<li>List Item A</li>
<li>List Item B</li>
<li>List Item C</li>
<li>List Item D</li>
<li>List Item E</li>
</ol>

</body>
</html>