Hello Guys,

Can someone please help me with this little problem I am having? If you go to this website using IE. You can see that above the navigation I get a blue line which I can't fix with IE. All the other browsers are working great. Can anyone help me with this problem?

www.petzonesarnia.com


thanks for any type of help

you might try adding border="0"

 <div id="header_bg">
<img src="asset/image/site/images/Petzone_top_leftcorner.gif" alt="background top bar" width="10" height="55" border="0"/>
<a href="index.php">
<img src="asset/image/site/images/Petzone_05.gif" alt="background top bar" width="123" height="55" border="0" />
</a><img src="asset/image/site/images/Petzone_06.gif" alt="white space" width="336" height="55" border="0"/>
<img src="asset/image/site/images/Petzone_top_puppie_02.gif" alt="Puppie image" name="Puppie_image" width="254" height="150" id="Puppie_image" border="0"/>
<img src="asset/image/site/images/Petzone_07.gif" alt="background top bar" width="47" height="55" border="0"/>
</div>

this code is generated right or you wrote it?

Except it's not a border issue and even if it were, that type of thing should be done in the CSS.

I would make the following suggestions;
- On the home page you've included the css file for 2col_leftNav as well as 3 other stylesheets. I suspect you're getting conflicting styles there. In fact, when I comment out the petzone.css link, that blue "line" disappears. The blue showing thru is the background of your page thru a gap.

- The top bar, the one you call #header_bg - don't slice it that way, you're not slicing images for tables. You can easily make that top section 1 single graphic.

- I'm not sure what you're doing with CSS like this:

#superwrap #wrapper #contact_wrap #contact_content {
padding: 20px;
}

If your aim is to apply that padding to all of those divs, then the elements must be separated by commas. If you're pyramiding just to target the last element, it's not necessary and you're making things more difficult for yourself.

Thank you for your help. I will report back to you.

Later on today.

LadyRed, thank you for your help. The blue background line is gone now. But how do you know how to fix that problem. I mean how do you know how to solute the trouble? I would like to be a better designer.

Thanks for your help again.


p.s. maybe you can help me with this IE Problem the navigation, when you scale the browser window its muss up.

Well, debugging IE problems just takes practice. The resource I gave you, Positioniseverything.net is a great resource. You could also try css-discuss.org, all the CSS gurus are on that list and they are always there to help - and explain. Their WIKI is a gold mine.

I also use 2 extensions for Firefox that help a LOT - the Web Developer extension and Firebug, I can't do without them any more.

I'll take a look at your navigation and see if I can spot the problem.

Wow LadynRed, I know about the FireBug plugin but the Web Developer extension is great too. I can see why you can't do without those two plugins.

Thanks again for your time and energy helping a rookie like myself with IE problems.

Many thanks again!!

I looked at your navigation. It appears that the code on that nav bar is set to position: absolute, and that will cause the problem you are having. All the styles for that menu is pretty complicated, there are simpler solutions out there that are pure CSS (or nearly so) that would be a lot cleaner.

LadynRed,

What do you mean? I have try to change the css code for 3 hours and still can't fix the problem.

thanks again

Let me put it this way ... dump the Spry menu bar, you don't need it, you can create virtually the same menu w/o javascript and all that excessive css.
Here's just one example - NO javascript:
http://www.cssplay.co.uk/menus/basic_dd.html

If anyone happens to have javascript turned off, they would not be able to navigate your site.

I can't really debug it because I have no idea what's going on in the scripting. There are several places where parts of the menu are positioned (absolute or relative) and the stacked classes and Id's are a nightmare to untangle... sorry.