In this tutorial, I review positioning page elements with Cascading Style Sheets (CSS). I cover the use of margins and the positional properties of absolute, relative, and static positioning. The aim of this tutorial is to avoid getting overly complex or complicated. I cover just enough so that you can understand these positioning options. I hope this tutorial gives you the boost you may be looking for to experiment with and to discover more about positioning elements with CSS for yourself.

Remember that all the CSS in this tutorial is shown without the style tags and you should place it in the head of your page—just above the closing </head> tag is an ideal place. In a production page, place your CSS in an external style sheet.

<style type="text/css">

<!-- 
Your CSS sits in here
--> 
</style>