For April Fool’s Day this year, I decided to do an amusing CSS trick instead of my usual fake news story. I turned the entire web site on its head, using a simple CSS3 attribute, and added a bit of JavaScript to jump down to the bottom (or top?) to complete the effect.
The CSS is simple, though of course it won’t work for Internet Explorer, except for the very latest version.
#flipdiv {
width: 100%;
height: 100%;
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
Now you want to wrap everything inside your <body> element with a new <div>. (You have to style the div instead of the body itself, as you get some weird box model issues otherwise.) It would look something like this:
<body> <div id="flipdiv"> ...everything else... </div> </body>
If you want to automatically scroll down to the new top of the page, a.k.a. the bottom, you can use a little JavaScript snippet to bump it down.
<script type="text/javascript">
window.onload = scrollDownToTheTop;
function scrollDownToTheTop() {
window.scrollTo(0, document.body.scrollHeight);
}
</script>
Silly, but not bad for an April Fool’s joke. 
