28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Actuellement, j'ai un menu de navigation qui ressemble à ça :
Smiley url http://img11.hostingpics.net/thumbs/mini_510096Capturede769cran20150902a768064055.png[/url]

Codé de cette manière :
HTML

<div id="navigation"><div class="inner">

<a href="http://www.kirsten-dunst.fr">News</a>

<a href="/kirsten-dunst/">Kirsten</a>

<a href="/carriere/">Carrière</a>

<a href="/photos/" target="_blank">Photos</a>

<a href="/videos/">Vidéos</a>

<a href="/site/">Site</a>

</div>

CSS

#navigation {

	margin: 0 auto;

	width: 100%;

	background: #ffffff;

	padding: 35px 0px;

	font-family: "Times New Roman", Georgia, Serif;

	text-align: center;


}



#navigation .inner {

	margin: 0 auto;

	width:1080px;}



#navigation a {

	font-size: 13px;

	color: #343434;

	margin: 0px 15px;

	font-weight: 500;

	letter-spacing: 6px;

	text-transform: uppercase;	

	padding-bottom: 7px;

}



#navigation a:hover {

	border-bottom: 2px solid #31c68b;

	padding-bottom: 7px;

	margin: 0px 15px;
	
	transition: all 1s ease;}



#navigation a:first-child {

	border-bottom: 2px solid #31c68b;

}

Je voudrais ajouter le logo de mon site et obtenir ça :
Smiley url http://img11.hostingpics.net/thumbs/mini_323500Capturede769cran20150902a768064537.png[/url]

Codé de cette manière

HTML
<div id="navigation"><div class="inner">

<a href="http://www.kirsten-dunst.fr">News</a>

<a href="/kirsten-dunst/">Kirsten</a>

<a href="/carriere/">Carrière</a>

<img src="/wp-content/themes/ERD_kdunst/images/logo.png" width="128px" height="39px" alt="logo"></img>

<a href="/photos/" target="_blank">Photos</a>

<a href="/videos/">Vidéos</a>

<a href="/site/">Site</a>

</div>

CSS

Même CSS

Mais j'obtiens ça :

Smiley url http://img11.hostingpics.net/thumbs/mini_314542Capturede769cran20150902a768195043.png[/url]


En gros, je voudrais que mes liens soient centrés en hauteur...et aussi que la hauteur de mon menu ne soit pas plus grande malgré mon logo.

Pouvez vous m'aider à résoudre mon problème ?
Merci d'avance !