CSS Positioning Tutorial

by James Cook on October 4, 2010

The use of Cascading Style Sheets (CSS) to position html objects in a webpage is one of the most powerful tools available to web designers and developers. It forms the core of all modern, standards-based web design. Unfortunately, it can also be the most difficult tool for designers to grasp.

That's why I developed an interactive CSS Positioning Tutorial (NOTE: FireFox, Safari or Chrome recommeded. The demo is not fully functional in Internet Explorer 8) that allows students in my Dominate Dreamweaver to experiment with CSS positioning properties on a live web page. It demonstrates the use of the float, clear and position properties as well as absolute, relative and fixed positioning. I've had such good response to the page that I'd like to share it with readers of my blog as well.

CSS Positioning Tutorial Image

Click the image to view the tutorial

If you've had trouble grasping CSS positioning (and who hasn't) click here to use the interactive CSS Positioning Tutorial and then please return and post your questions about CSS positioning. I'll do my best to answer them. And, if you have any suggestions about how to improve the tutorial, I'll try to incorporate them in version 2.o.

Comments on this entry are closed.

Previous post:

Next post:

Home | Make Contact