Barra no topo (imagem)

Depois de muitos pedidos de como colocar essa barrinha no topo, enfim vou postar para vocês. O código que eu uso aqui no blog pertence ao blog Menina Nerd, da Andreza (portanto os créditos são para ela!). Primeiramente proucure pela tag: body { e apague todo o código que o acompanhe, como no exemplo do MN:

body {
background: url("http://www.backgroundlabs.com/backgrounds/202.gif") repeat;
margin:0;
color:#333333;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Substitua tudo o que acompanhe a tag body { pelo código abaixo:

body, html {
height: 50px;
margin: 0;
padding: 0; }

body {
background: url("URL da barra") repeat-x; }

html {
background: url("URL do background de fundo") repeat; }

Troque aonde está escrito "URL do background de fundo" pelo url da sua imagem de fundo. Agora salve a imagem abaixo e edite a seu gosto. Esta cortininha pertence ao I love HTML.

http://static.tumblr.com/4bage8q/97Xlmqw2h/01.png

OBS: Caso fazer uma barrinha maior que 50px de altura modifique o numero que está em vermelho no código. Ele fica atrás da navbar e do cabeçalho com fundo colorido, ou seja para aparecer bem é necessário retirar a navbar e colocar o fundo do cabeçalho na cor "transparent". Lembrando: O código é do blog Menina Nerd. Bom espero que tenham gostado do tutorial. Não testei no Internet Explorer pois não estou conseguindo abrir, mas creio eu que funcione.

Beijos, 

Emily