When I use photoshop to design my page and then I export it as xhtml/css
and view it in Firefox it looks fine, but when I preview it IE7 there are lots of white gaps I seem that if I set the image as a background image the white space goes any but this doesnt allways work?

Heres what it looks like:

IE 6 & 7 have ALOT of little quirks that can cause pages to look wierd when using CSS. Without seeing your code, it's impossible to tell exactly what your problem is. One thing you could try is running the code through http://validator.w3.org and see if it points out anything wrong with your site. If that doesn't fix it, try posting your code (or the relevant portions) and somebody could probably help you a little bit better.

Ok here is section of code from one of the white spaces

<div style="position:absolute; left:11px; top:34px; width:218px; height:15px;">
<img id="index_15" src="http://www.webmaster-talk.com/images/index_15.gif" width="218" height="15" alt="" /> </div>

Dont know why it has inserted http://www.webmaster-talk.com before the images/ but ignore that bit

We'll have to see more than that, but if you've got EVERYTHING set to position:absolute, you're in big trouble right there. IE7 has far few quirks than IE6. Do you have a proper DOCTYPE on your pages ??