Header e conteúdo em conflito

Pode passar o endereço do seu projeto, ou o seu html e seu css completo, por alto assim fica difícil responder.

Todos elementos com o posicionamento não declarado, recebem o valor padrão "static", o que significa que o elemento seguirá o "fluxo normal" do documento, e será inserido no contexto de elementos "vizinhos".

Ou seja, como o seu "body" não teve o posicionamento declarado, ele seguiu a margem declarada no elemento "#wrap", o que naturalmente leva o elemento estático "header" a seguir o fluxo do seu elemento pai "body".

Você conseguirá resolver desta forma:

body {

 width:100%;
 position:absolute;
}

 height:50px;
 width:100%;
 position:fixed;
 top:0; /* O elemento se posicionará sempre no topo da página, seguindo o fluxo da tag HTML */
 z-index:99;
 margin:0;
}

Caramba xará, deu super SUPER certo! Então, só pra entender, "*Ou seja, como o seu "body" não teve o posicionamento declarado, ele seguiu a margem declarada no elemento "#wrap", o que naturalmente leva o elemento estático "header" a seguir o fluxo do seu elemento pai "body**".*", quis dizer que o meu header tava seguindo o padrão margin que o body tinha herdado do wrap? e porque colocou o body como absoluto? ele não vem por padrão? desde já grato!

quis dizer que o meu header tava seguindo o padrão margin que o body tinha herdado do wrap?

Exato, como disse, os elementos com posicionamento não declarado, são dados automaticamente como estáticos, e seguem o fluxo de elementos vizinhos. No caso do body seguiu o wrap, e o header seguiu o body consequentemente.

e porque colocou o body como absoluto? ele não vem por padrão? desde já grato!

Porque todo elemento tem posicionamento padrão estático, como disse acima.

\õ, valeu, abraço!