HELP!! site looks different in IE and FF,

Hello everyone, I am a totally new to zen cart and website design. I am working on a site "www.fashionfavourites.com", and I have a problem I cannot solve:frusty:.

1. Why does the site looks different in IE. As you can see it expands the page (notice no background in IE).

2.My navigation bar (I think that's what it's called) where it say HOME|LOGIN|MY ACCOUNT..etc, does nothing in IE. It behaves like a normal TEXT :frusty:. This should be a link to a new page or something like it does in FF.

Please help, as I been searching everywhere for answers including my local library.

Thank you all ...

Sadly. MSIE has been developed to NOT follow css conventions, and work-arounds are often needed. You'll have to search the WWW for these... unless someone on the forum can help of course.

BTW, your body declarations in your stylesheet read:

body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #000000;
background-color: #ffffcc; 
//background-image: url(../images/bg.gif);
}

You have "commented out" background-image using //

That is incorrect syntax for CSS.

Commenting out takes this form:

/*background-image: url(../images/bg.gif);*/

This may explain why your background in IE is white - I think it's reading this image...

If you comment out the line using the proper syntax, your yellow background will display in IE.

Your stylesheet is FULL of //.

That will explain much of the problem.

Use the correct syntax and you should see an improvement.

The header nav works for me in FF3 and IE6.

The display problemsyou are experiencing are probably due to different error handling in IE and FF. You have used PHP // comments in your stylesheet; these do not work in CSS. You need to change all // to /* and */.```
body {
margin: 0;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
color: #000000;
background-color: #ffffcc;
//background-image: url(../images/bg.gif);
}

.centershop {width: 100%}

a img {border: none; }

a:link, #navEZPagesTop a:link, #categoriesContent a:link, .sideBoxContent a:link, #navMain a:link, #informationContent a:link, #navSuppWrapper a:link, #siteinfoLegal a:link {
color: #000000;//#F1EDE7;//This is for an unvisited link...Set to black
text-decoration: none;
}

Thank you very much guys, that helped a lot. Now I can see the border in IE, and my navigation links work... :clap:

Thanks guys, Never though It was something that simple..:blush:

Hi guys, can someone help me with this, I want to add the Advanced search bar next to where it says "free shipping". I would like this to show on the left side of free shipping. <a href=”http://fashionfavourites.com/”>Website is here</a>

I tried many things with no success, just messes up the rest of the site.

I am not sure as to what you're trying to accomplish by doing this, but its pretty straightforward (unless I'm not getting the question?)

This is the code of your header section:

<div id="headerWrapper">
<div id="navMainWrapper">
<div id="navMain">
<ul class="back">
<li>
<a href="http://fashionfavourites.com/">Home|</a>
</li>
<li>
<a href="http://fashionfavourites.com/index.php?main_page=login">Login/Register|</a>
</li>
<li>
<a href="http://fashionfavourites.com/index.php?main_page=account">My Account|</a>
</li>
</ul>
</div>
<div class="navMainSearch forward">
<form method="get" action="http://fashionfavourites.com/index.php?main_page=advanced_search_result" name="quick_find_header">
<input type="hidden" value="advanced_search_result" name="main_page"/>
<input type="hidden" value="1" name="search_in_description"/>
<input type="text" onblur="if (this.value == '') this.value = 'Enter search keywords here';" onfocus="if (this.value == 'Enter search keywords here') this.value = '';" value="Enter search keywords here" style="width: 100px;" maxlength="30" size="6" name="keyword"/>
<input type="submit" style="width: 45px;" value="Search"/>
</form>
</div>
</div>
<div id="logoWrapper">
<div id="logo">
<a href="http://fashionfavourites.com/">
<img height="86" width="604" title=" Powered by Zen Cart :: The Art of E-Commerce " alt="Powered by Zen Cart :: The Art of E-Commerce" src="includes/templates/CUSTOM/images/mylogo.gif"/>
</a>
</div>
</div>
<div id="navCatTabsWrapper">
<div id="navCatTabs">
<ul>
<li>
<a class="category-top" href="http://fashionfavourites.com/index.php?main_page=index&cPath=1">Men</a>
</li>
<li>
<a class="category-top" href="http://fashionfavourites.com/index.php?main_page=index&cPath=2">Women</a>
</li>
</ul>
</div>
</div>
<div id="logo2">
<a href="http://fashionfavourites.com/">
<img height="33" width="976" title=" Powered by Zen Cart :: The Art of E-Commerce " alt="Powered by Zen Cart :: The Art of E-Commerce" src="includes/templates/CUSTOM/images/shipping_logo.gif"/>
</a>
</div>
</div>

You want the Advanced search in the div that FREE SHIPPING to US and Canada & UK img is the background for?

So, in this div (id=logo2) place the proper code, and make sure that all the heights, widths, padding and margins don't add up to more than the logo2 div, or it'll break it. Also, take care to note whether or not the advanced search field isn't declaring a clear: both property, thus not allowing content to the left or right of itself.

This is how I understand it to the best of my knowledge, if anyone has any corrections or additions, feel free!

-Tim

Tim thanks buddy, I'll give that a try.
What I plan on doing is eliminating (turn off) the sidebox on the right side column that contains the advanced search, and simultaneously utilize the empty space next to the free shipping. That is why I want to move it to that area.

About your suggestion, I can follow your suggestions except one little problem:shocking:. Where can i find the code responsible for the advanced search box (what code). My understanding is that this code will go below the div id=logo2 section of tpl_header.php.

And one other thing what controls the padding and margin for that section(advanced search bar) in the stylesheet?

thanks guys, appreciate it.

Wow..After working on it for so long i fugure my own solutions to the problem, and learning a whole lot in the process. I now feel ready (sorta) to help other struggling new zenners.