Different Browers different looks

What version of chrome and firefox are you loading it in? I have the most up to date version of chrome and it looks perfectly normal.

Now when I load it in internet explorer, that’s a whole ‘nother story. Now it appears as a black container with links in it.

To me it doesn’t look like your gradient/styles are loading properly in IE for your navigation container.

It’s possible that you haven’t set up the proper browser specific CSS to render it properly in IE. Each browser has a different vendor prefix for gradients and certain other properties such as box-shadow.

Try this code: (Note the -ms-linear-gradeint, specific to IE and Safari)

#access {
background: #9a7529;
background: -moz-linear-gradient(top, #9a7529 0%, #0a0a0a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9a7529), color-stop(100%,#0a0a0a));
background: -webkit-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: -o-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: -ms-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: linear-gradient(to bottom, #9a7529 0%,#0a0a0a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9a7529', endColorstr='#0a0a0a',GradientType=0 );
}

Wow…… incredible info…..
On my computer I have:
Google Chrome: Version 29.0.1547.57
Fire Fox: 13.0.1

I placed the code you gave me into my child-theme… at the very bottom.
Am I correct in doing that????

What do you see now?

Oh…. by the way the search box appears in Chrome & Firefox.
It should not be there.

???????

Thx’s again!

Dear Evan Herman,
On the right track….

when I put this code into my child-theme….
/* =Menu
————————————————————– */

#access {
background: #9a7529;
background: -moz-linear-gradient(top, #9a7529 0%, #0a0a0a 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9a7529), color-stop(100%,#0a0a0a));
background: -webkit-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: -o-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: -ms-linear-gradient(top, #9a7529 0%,#0a0a0a 100%);
background: linear-gradient(to bottom, #9a7529 0%,#0a0a0a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#9a7529′, endColorstr=’#0a0a0a’,GradientType=0 );
}
The website looks great on all 3 platforms…. Sarfari/Chrome/Firefox…
EXCEPT it is missing the Menu Bar….
so can you guide me where to go from here?????

This was the previous one:
/* =Menu
————————————————————– */

#access {
background: #222; /* Show a solid color for older browsers */
background: -moz-linear-gradient(#9A7529, #0a0a0a);
background: -o-linear-gradient(#9A7529, #0a0a0a);
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from (#9A7529, to (#9A7529)); /* older webkit syntax */
background: -webkit-linear-gradient(#9A7529, #000000);
-webkit-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
-moz-box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
box-shadow: rgba(0, 0, 0, 0.4) 0px 1px 2px;
clear: both;
display: block;
float:left;
margin: 2auto 0px;
width: 100%;

SORRY FOR THE LONG WINDED POST!

M

I FIGURED it out…. by adding code line by line til Menu appeared.

THANK you Evan Herman for your guidance & direction!
So appreciated!