We always enjoy seeing new guestbook entries! Click Here for More Information
Home About Contact FAQ Guestbook Site Map Links Group
Home Support Previous Updates Site Map Terms of Use Privacy Policy
Updated March 1, 2010
-  Powered by Jspunkette  -

Div Layout Tutorial


If you've seen my profile, you may have seen some things that look like div layouts. A lot of people have asked me how to make them, and this tutorial will teach you. Now, it's a long tutorial - so I ask you to be patient.
If I get questions on how to use it, I'll clarify and edit some of this tutorial.

Now, I'm going to use my example a lot, as examples are awesome to explain things with. I will be using this picture for my layout.

First, I think you should understand how this layout works. You start out with one picture, and this will be your layout/menu/content. Throughout this tutorial you will understand how to use just one single picture to make a fantastic layout. Don't believe me? Well then, I dare you to use this tutorial.

I will recommend some materials for you to use, some of them you may wonder why. This will be explained in the tutorial, but I want to make sure your set up prior to doing this. It's a pain to be using a tutorial and realizing you need something while in the process. So, let's get you set up for this first. Some of them are optional, but highly recommended. All these materials I use during this process.

There will be screenshots in the tutorial that you can click on + it will open up in a new window for you.

Recommended Materials:

  • Paint.net * (you may get this program for free by going here)
  • A place to store your picture on the web (Ex. Photobucket or FileDen)
  • Firefox Browser * (the tabs option comes in handy, and I just prefer Firefox. You can get it here)
  • Some knowledge of HTML/CSS * (it's ideal that you at least understand some of it)
  • Paper + Pen/Pencil * (Not required but very helpful)
  • IMVU Links Generator (You can find it by going to here)

* = not required

Step 1