I was trying to help a friend of mine create an image and slice it for a web page template..... I think my slices should work fine and saved it out. Now I have it in dreamweaver and I'm trying to make the leftpage and right page of the book background images in those cells so that I can place text over them, but everytime I try to do it the images dont line up correctly. I have tried setting the cell width and height to the image dimensions, but still can't get it right.

Here is a link to the unedited html file that photoshop created.

http://www.volkswes.com/SHIVVYDIVVYDIV/akd/

Does anyone have any suggestions on how to do this.....or an easier route for doing a similar style page?

Take the image out of the table, set the image as the background of the table, and the width and height of the table to the width and height of the image. If you want a code sample, let me know, and I'll post one.

Well, that's what I tried to do, but I guess I didn't code it correctly because it is leaving a gap and not lining up correctly.... I don't have much experience in this area so, sure a sample would be a great help

Another question that I thought about......will the image still work fine as a background if I nest another table inside one of those cells in order to try and create a contact form?

Looks fine to me...in Firefox

Yeah, sometimes lining those images up in a table can be tricky. I've tried before puting a line break <BR> after the image in a table cell will make it line up correctly. Don't ask me why, because it shouldn't work that way, but sometimes it does.

If you need help in looking at it, let me know and I can see what I can do with it.

Another option (and what I'm leaning toward nowadays) is to get rid of the table and use DIV tags with style sheets. You can set the background image and exact positioning much easier with stylesheets.

Depending on where you are going with this you really should be using <div> tags and CSS to create the template. I've thrown together a quick and dirty sample, however, I only used CSS on the two <td> columns where text would go. It is still a table layout, but now I've given the table a CSS ID as well as the two halves, col-left and col-right. Inside each respective <TD> is a <div> tag with either copy-left or copy-right as the ID for CSS to style.

File is here.

Nice work Tadams!!

Yup, same.

Tadams is pointing in the right direction. Volkswes, I'm sorry to inform you that tables and cells are for displaying, well, tables and cells. You really have to learn about CSS and tags such as div, id and class. It's not really that hard and it takes only a few days to learn. New versions of browsers are developed with xhtml and CSS in mind.

I have a lot to learn....that looks good to me. Very nice tadams! Thanks a bunch! I'll check out the code and see if I can understand it.

I'll try to find some info or tutorials that I can start playing with. Maybe I'll see if I can find some CSS books at the library.

Any other suggestions for the page? I am always trying to learn more and always open to any criticism.

Thanks
Wesley

One of my favorite tools for working with CSS is CSSEdit. This is a great tool for troubleshooting, viewing other people's work and once you understand CSS, you can use it to write code and see live updates. Stylemaster by WestCiv is another CSS tool I use. The company also has a fine set of tutorials and online books for purchase.

Get a good book. Keep it simple. The web is full of CSS templates and widgets, so you may find it easier learning to tweak one of these. Remember to check your work in different browsers and on Macs and PCs.

may I suggest firebug as well?
check out the website and video
http://getfirebug.com/

Thanks again guys, I really appreciate all the help and tips.


Procyon: Love to see that you are still using the chicken eating a cupcake and mcrib sammich gif...one of my favorites

Here are some of the others from way back then

If you're on a PC then the Web Developer Toolbar and Firebug are two indispensable plugins for Firefox. They should be required tools for web work. WBT allows you to also edit the CSS of any site right from the browser. Firebug helps with troubleshooting Javascripting woes.

As for books I just tried one of the O'Reilly "Head First" and "Head Rush" books. They're AWESOME if you're a visual learner with ADHD (like, cough, me). They're not reference books but rather are books to teach you the core concepts so that you can then deal with the tedium of the reference books. They've got an XHTML/CSS book. I haven't read it but based on the AJAX one I'm reading I'd recommend it.