I’m redoing my web site and I’m getting very close to end, time to put in the final content, but when I went to do browser testing I noticed a rather big problem… IE6 was adding extra area under my header images.
I’ve tried everything I can think of… Quick list is:
• Adding Padding to the top attempting to push it all down. I thought it might be the background was stretching things.
• Defining all heights. That did succeed in making all the title images that were out of alignment be off by the same amount, if nothing else. Though, Removing some of that height does not fix the problem.
• I’ve tried using margin to space my image instead of padding, both had the same visual effect.
If you view my portfolio in IE6 you’ll notice the messed up headers on the Home, About and Contact page, but not on the Portfolio page. I don’t know why that would be yet… That seems to be just the case.
Also, I’ve browser tested in IE7, IE6 and Firefox for PC and Safari and Firefox for Mac. IE 6 for PC is the only one that has any problems on the entire site.
Does anyone know what IE6 is doing? I can’t figure it out and I’m on a really tight time scale. The files involved are the index file and the [url=www.dougstewartdesign.com]CSS file. I’ve just been playing around on the Home page for now, if I get that working I’ll apply the solution to the others.
I’ve also included a screen shot of what I’m talking about here.
