I usually create all of my skin using tables, however I know DIVs are the better way to go. Ive been reviewing the tutorials but I'm still lost. Is there a way to take an existing table skin and turn it into div CSS skins? I even tried starting from scratch and I'm just not sure what to do. I create my graphics file in fireworks and then export as an HTML with nested tables. How do I begin using Divs? I've attached my current skin and original graphics file so perhaps you can help?

The way I would approach it is to start from the beginning with none of the info from the tables code.

For instance I would export the logo and green swish as one image and set that as a background to a top div

I would probably approach it with a structure such as

top div - contains logo + swish
menu div - contains horizontal menu
content section div - contains menu on left and content panes section on right
footer div - contains swish as background image and all of the links, copyright etc

The structure should be much simpler than your tables version.

I would suggest you begin by just adding the top logo and swish, a horizontal menu, and a content pane.

Don't try to add everything at once, just add one element at a time and make sure that it works correctly before adding anything else.

I would just start with one content pane and make sure the layout works correctly with the vertical menu and footer. Once all that is working, you can then look at adapting the various content panes.

If you are starting with CSS skinning, I would begin with this tutorial:

• How to create a pure CSS skin
• How to create CSS containers

Hope this helps,