Question

Here is the scenario:

<div class="menu">
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</div>

and CSS:

.menu li {display:inline}

The results would be:

1  2  3

but I want to display them from right to left:

3  2  1

How can I achieve this please?

Answer 1

ul {
    width: 50px;
}
li {
    display: inline-block;
    float: right;
}​

Also, you can’t have li being the direct descendents of a div. Use ul or ol

Demo