Well its my first project so knew there would be hiccups. That and I'm slowly teaching myself.

I have this site I'm creating: http://darwinliving.net it looks perfect in chrome, opera and firefox but cant for the life of me figure out why IE has issues with it. It comes up with this white space just under the header..

Plus if you pros could have a look and see if there are other things in there that could be improved.

I have been using Dreamweaver CS4 with Fireworks and Photoshop.

Go easy on me I am completely new to this.

You need to head over to www.positioniseverything.net and learn about IE's many bugs and how to defeat them. IE also has a problem with very tight layouts, you'll have to adjust widths, margins and padding to make it work. You're also going to need conditional comments and a separate CSS file just for IE 'fixes'.

Oh.. ow.. you've got an XHTML doctype but your using that horrid <font> tag ?? NOT allowed in XHTML and ALL styling belongs in your css, NOT in that nasty <font> tag.

You really shouldn't be using images for navigation - SE spiders can't read images - and for accessibility your navgation should be REAL TEXT.

Hmm, I might start fresh with a new template.. One with a css stylesheet.

What do you mean by images for navigation? talking about my forum and home buttons ETC? what other way is there.

What do you mean by images for navigation? talking about my forum and home buttons ETC? what other way is there.

When you use images for navigation in the way you have it, search engines have no idea that is a menu item linking to other pages of your website. It just thinks it is a graphic addition serving no real purpose. Your "alt" text doesn't explain the image either.

Navigation usually comes in the form of a list, even if that list is images. (as in <ul><li> etc.)
There are specific ways you can use images as menu item links and still have text available for spiders. Basically, you still want text "listed in your html" but not visible to the user in this case. Consider the text "sort of" hiding on the page, but readable to spiders(not users). This is done through CSS by negative margins, text-indents, or display:none. There are many ways, you'll have to google it.

You can put those images in the CSS as a background image. Let us know if you need an example of this method.

In your case, your really not doing that much that those menu items HAVE to be an image, you could probably get by with standard text and have some hover effects too. That is not a negative comment on your design, just a suggestion. May want to move your CSS to external stylesheet as well.

I would like to keep the images as I have designed it around my forum template.

Originally Posted by LadynRed

You need to head over to www.positioniseverything.net and learn about IE's many bugs and how to defeat them. IE also has a problem with very tight layouts, you'll have to adjust widths, margins and padding to make it work. You're also going to need conditional comments and a separate CSS file just for IE 'fixes'.

Oh.. ow.. you've got an XHTML doctype but your using that horrid <font> tag ?? NOT allowed in XHTML and ALL styling belongs in your css, NOT in that nasty <font> tag.

You really shouldn't be using images for navigation - SE spiders can't read images - and for accessibility your navgation should be REAL TEXT.

Couldn't you just use a span with the text on the image, and then in the styles.css file make it invisible? Would SE's see that?

Well i re did the site and had the same problem but this time I solved it with a simple header height... http://darwinliving.net
Thanks for the suggestions. its so much easier to work with a styesheet ad a lot cleaner..

Couldn't you just use a span with the text on the image, and then in the styles.css file make it invisible? Would SE's see that?

Making things 'invisible' is not the way to do things - bad idea.