i had a php script where it was getting information from a database but the order in which the information was being displayed was in the order of the mysql database so i wanted to display it in reverse.

For example, this is how I was retrieving database from mysql table:

five four three two one

So as you can see, it was displaying five first, but i wanted to display this list in the reverse order, what i wanted to display like was like this:

one two three four five

I guess i could write a php / mysql script where the code will go through some loop and a function and make the whole script more complicated, but i wanted to be simple, because the more complicated a script gets, the more processor and memory is used by the server.

I contacted the folks at www.webune.com for their support, and they gave a cool little tip and trick on how i can display my list in the order that i wanted. so this is the code you would use.

So lets say on my example, I have this: five four three two one but i want it to show in the reverse order like this: one two three four five this is the HTML CSS code i would use to achieve what i want to do on my webpage for my menu.


first put this code beteen the <head> and </head> tags on your html web pages:

CODE:
<style type="text/css">
<!--
.left {
   float: right;
   clear: left;
}
.left-div {
   float: left;
   width: 200px;
}
-->
</style>


and put this code in your body of your html page: (after the <body> tag)


CODE:
<div class="left-div">
<div class="left"> five </div><div class="left"> four </div><div class="left"> three </div><div class="left"> two </div><div class="left"> one </div>
</div>


Putting it all together. The next HTML code is an example webpage i create so you can see a full html webpage sample. Just copy and paste into a blank notepad and save it as reverse.html and then open it with your browser.


CODE:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Display My list in resverse by wallpaperama.com</title>
<style type="text/css">
<!--
.left {
   float: right;
   clear: left;
   font-weight: bold;
}
.left-div {
   float: left;
   width: 200px;
}
-->
</style>
</head>

<body>
<h1>Show Menu In Reverse Order by <a href="http://www.wallpaperama.com">Wallpaperama.com</a></h1>
<hr>
<p>My Original Menu Order: </p>
<p><strong><br>
  Five Four Three Two One</strong></p>
<p>My Menu In Reverse Order After My CSS Style: </p>
<div class="left-div">
   <div class="left"> Five </div>
   <div class="left"> Four </div>
   <div class="left"> Three </div>
   <div class="left"> Two </div>
   <div class="left"> One </div>
</div>
<p>&nbsp;</p>
<p align="center"><a href="http://www.webune.com"> Web Hosting Provided By Webune.com   </a></p>
</body>
</html>