Header CSS porcentajes

[pzin]

Si es complicarse la vida lo que haz hecho.

A falta del interior —que no debería de tener mucho misterio— puedes simplificarlo un poco.

Código HTML:

<header>
  <div>
    <img src="http://subir.cc/images/sinttuhhh.gif">
  </div>
</header>
 

Código CSS:

header {
  width: 100%;
  height: 99px; /* esto según estaba la imagen sin la sombra */
  overflow: hidden;
  background: -moz-linear-gradient(left,  rgb(255,255,255) 50%, rgb(0,124,132) 50%);
  background: -webkit-gradient(linear, left top, right top, color-stop(50%,rgb(255,255,255)), color-stop(50%,rgb(0,124,132)));
  background: -webkit-linear-gradient(left, rgb(255,255,255) 50%,rgb(0,124,132) 50%);
  background: -o-linear-gradient(left, rgb(255,255,255) 50%,rgb(0,124,132) 50%);
  background: -ms-linear-gradient(left, rgb(255,255,255) 50%,rgb(0,124,132) 50%);
  background: linear-gradient(to right, rgb(255,255,255) 50%,rgb(0,124,132) 50%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#007c84',GradientType=1 );
}
  
header>div {
    width: 1000px;
    margin: 0 auto;
}
 

Debería de funcionar en todos los navegadores —incluyendo IE6. Lo único que tendrías que cambiar header por div para tener una compatibilidad con html5 o usar un normalize de CSS y html5shiv.
Aunque seguramente te sea más fácil cambiar header por div.

Está en blanco, aunque yo veo la imagen de color gris.