Imagem nao alinha bem css+html

[dkcuck 0]

Ola , eu estou a construir uma barra(tipo menu) para um site em css e html, e estou com um problema.

Quero alinhar uma imagem tipo logo mas nao alinha bem, alinha no topo.

com a tag do html <center> e <div> nao resolveu e usei o css como li aqui no forum.

link da barra: http://mastergaming.us/barra1.html

PS: sou iniciante em css.

[Nícolas Luís Huber 14]

Como você é iniciantes eu realizei o código para você e se houver alguma dúvida eu lhe explico, vamos aos códigos:

 

Aqui temos o HTML:

  <header class="header">
    <div class="logo"><img src="http://mastergaming.us/netgroup.png" alt="" width="50" height="10"></div>
    <nav class="nav">
      <ul>
        <li><a href="#">Notícias</a></li>
        <li><a href="#">Desporto</a></li>
        <li><a href="#">Entretenimento</a></li>
      </ul>
    </nav>
  </header>

 

Nota: Eu ocultei a estrutura básica da página, as tags head, body e ainda o doctype (não é tag).

 

Agora temos o CSS

* {
  margin: 0;
  padding: 0;
}
html {
  font-size: 100%;
}
body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
}
.header {
  width: 100%;
  height: 50px;
  background-color: #EDEDED;
}
.logo {
  width: 50px;
  height: 10px;
  margin-top: 15px;
  float: left;
}
.nav {
  float: left;
  margin: 0 0 0 20px;
}
.nav ul {
  list-style: none;
}
.nav ul li {
  display: inline;
}
.nav ul li a {
  float: left;
  text-decoration: none;
  padding: 15px 4px;
  margin: 0 10px 0 0;
  color: #333;
  border-bottom: 4px solid #EDEDED;
}
.nav ul li a:hover {
  background-color:#D6D6D6;
  color: #6D6D6D;
  border-bottom-color: #EA0000;
}

 

Nota: Esse CSS deve ser linkado ao documento HTML, através de <link href="nome-do-arquivo.css" rel="stylesheet">, isto dentro da tag head.