HTML help with webpage in iE Options

[bchilds22]

Hey guys, I've been having trouble with my website in IE. It is looking fine in safari/firefox. This is the url. http://nudm.org/mea
The problem is the navigation bar. I want it to be on the same level as the logo is, but it does not do this in IE. Any ideas as to why?
Thanks in advance!
Ben

[pandy]

It doesn't in the version of gecko I looked in either. I think it looks good like that.

Here's what I see.

[pandy]

I forgot to ask, do I understand it right that you want the menu up there at the top of the white area?

[Frederiek]

He wants it to look lke this, as it does in Safari:

The only errors I see is a missing TITLE, the wrapper div which is not closed and px units in width and height of inline images. Maybe fixing that will help. (I don't have IE).

BTW, what's that (Safari similar looking) Inspector covering the page upon loading? Seems a bit odd to show that to visitors of your site.

[pandy]

Thank you, Frederiek.

Aha, I didn't know gecko did this differently now. Anyway, place #nav before the image link in the HTML source and you are all set.

Wonder on what grounds gecko has changed this behavior though. I wasn't aware it had. Since Safari does it too, I assume there are reasons.

[bchilds22]

Thank you, Frederiek.

Aha, I didn't know gecko did this differently now. Anyway, place #nav before the image link in the HTML source and you are all set.

Wonder on what grounds gecko has changed this behavior though. I wasn't aware it had. Since Safari does it too, I assume there are reasons.

Thanks guys, you are great. It's one of those things where I feel like I look at it for an hours and it's something small like you said. I don't have internet explorer on my computer (I've got a mac) but I'm going to try your solution tomorrow.

Again, thanks soo much for your help!

[bchilds22]

Worked like a charm. The last two things I have been puzzled on were:
1) the logo image seems to be a lot lower quality on IE than on firefox/safari any thoughts on why?
2) also on IE, there is no border above the nav buttons when they are hovered over/active

Frederiek- I think that the box you are talking about was firebug lite, I was trying to use it to debug the website in IE. Luckily, the website is not really "live yet" (It is going to be hosted at a different domain), so there shouldn't be any visitors yet, that is except for you guys :-)

Ben

[bchilds22]

bump

[Christian J]

1) the logo image seems to be a lot lower quality on IE than on firefox/safari any thoughts on why?

Strange! Firefox and Safari render the image in a brighter shade even when I load it directly:



while IE8, Opera and Chrome (Iron) make it look darker.

When I save it to my computer some of my image editing programs make it look bright, others dark. Could some problem with the image file cause this?

2) also on IE, there is no border above the nav buttons when they are hovered over/active

I get the border in IE8, but not in 6 or 7. There are also validator errors that might help: http://www.htmlhelp.com/cgi-bin/validate.c...//nudm.org/mea/

BTW I noticed that you load the same style sheet twice.

[pandy]

The image looks the same to me no matter what browser I use.

IE up to I have forgotten what version, probably 5, needed trickery to display borders on inline elements. Later version can show a little erratic behavior also. Alas I have forgotten when and exactly what to do. But try something that would have helped IE5, say make the A 'display: inline-block' just to see if it works. I do seem to recall that's one of the tricks.

[Frederiek]

Don't resize the image through HTML. You set it to be 400 x 67px, while it really is 597 x 87px. By sizing the image down this way, the ratio isn't even the same anymore. Probably hence the color differences.

[Christian J]

The image looks the same to me no matter what browser I use.

Did you check with a color tool? If there's still no difference maybe it's due to OS (I have Vista).

[Christian J]

Don't resize the image through HTML. You set it to be 400 x 67px, while it really is 597 x 87px. By sizing the image down this way, the ratio isn't even the same anymore. Probably hence the color differences.

That doesn't explain my results...

Here's a comparison of http://nudm.org/mea/banners/logo.jpg in IE8 and Firefox 3.5.3. No zooming is done in the browsers, AFAICS:

[Frederiek]

In the meantime, the image has been scaled down to 400x58px.
Weird though, that the same image renders differently in different browsers on the same OS.
Maybe the following link helps to explain things : http://www.gballard.net/psd/go_live_page_p...EGprofiles.html

[Christian J]

Weird though, that the same image renders differently in different browsers on the same OS.
Maybe the following link helps to explain things : http://www.gballard.net/psd/go_live_page_p...EGprofiles.html

Yes it must be something with the image file, since my various image viewing programs also show either of the two versions.

BTW what a confusing (2 column?) page layout on that site.

[pandy]

The image doesn't seem to contain color profile information though.

[bchilds22]

It seemed to work out fine in the end for me, so i'm not going to worry if the color's are a little off, though I do want to read that page about color profiles because I'm still a little confused by that whole thing. Thanks for all your help in the meantime. I really appreciated it!

[pandy]

You could re-save the image and make sure profiles are stripped. If that helps, well, then there was a color profile after all.