The SitePoint Forums have moved.

You can now find them here.
This forum is now closed to new posts, but you can browse existing content.
You can find out more information about the move and how to open a new account (if necessary) here.
If you get stuck you can get support by emailing forums@sitepoint.com

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Will it be possible, concept design to CSS

Hi all,

I've been given a concept design to convert to HTML, now I have done a couple of sites and have always used CSS but the company normally uses tables so the design isn't really geared towards a CSS layout.

I just did a quick slice of how I think you should go about setting the website out. Although this is just my opinion, so you or someone else reading this thread may think of a more convenient method of laying out the website.

The top row would be the dimensions of the top slice (800x170), with the actual top slice image being set as the background.

The second row would be the dimensions of the second slice (800x21), with the actual second slice image being set as the background. I would change the navigation from images to text (to make it easily editable later on).

On the 3 columns in the third row, I have quickly used the scale tool to demonstrate how I think the elements should be placed (I tend to get a bit picky with exact pixel measurements). You'll notice that both the three columns have 20px padding on either side, this is to maintain a consistant feel.

The first column (third row) would be the dimensions of the third slice (120x410), with the actual third slice image being set as the background (top, no repeat), and the background colour as white. This will allow your body content (in column two) to stretch further than your image's height.

The second column (third row) would be 560px wide, with a padding of 20px on all sides (top, right, bottom, left).

The third column (third row) would be the dimensions of the fifth slice (120x140), with the actual fifth slice image being set as the background (top, no repeat), and the background colour as white. Once again, this will allow your body content (in column two) to stretch further than your image's height.

I've missed out a few minor details, but you will be able to fill in the blanks.