Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > CSS
CSS Forum d'entraide sur l'utilisation des feuilles de style CSS. Avant de poster : Cours CSS, FAQ CSS, Galerie CSS
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 02/03/2011, 11h52   #1
Invité de passage
 
Inscription : mars 2011
Messages : 5
Détails du profil
Informations forums :
Inscription : mars 2011
Messages : 5
Points : 1
Points : 1
Par défaut Alignement Image et Menu horizontal

Hello à tous,

J'ai actuellement un petit souci, j'ai fait une petite page et en haut de celle-ci j'ai un logo et un menu en liste horizontale. Mon seul petit problème c'est que je n'arrive pas à aligner les deux éléments. La seule chose que j'arrive à faire c'est de mettre des float mais le résultat est plutôt douteux... Idéalement je voudrais avoir le menu aligné avec le logo avec un peu d'espacement entre les deux éléments. Voici mon code :

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="header">		
 
	<img src="images/logo.png" alt="logo">
 
	<ul id="nav">
		<li><a href="#">Accueil</a></li>
		<li><a href="#">Vid&eacute;os</a></li>
		<li><a href="#">Projets</a></li>
		<li><a href="#">&Eacute;quipe</a></li>
		<li><a href="#">Contact</a></li>
	</ul>
 
</div>
Le CSS :

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.header {
width:950px;
height:95px;
margin:0px auto;
padding:0px 0px 0px 0px;
}
 
ul#nav li { 
display : inline;
padding : 0 0.5em;
}
 
ul#nav {
list-style-type : none;
}

Voilà voilà, si quelqu'un a une petite idée, je suis preneur.

Merci d'avance !
Beatboxxy est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 02/03/2011, 12h13   #2
Modérateur
 
Avatar de Bisûnûrs
 
Josselin
Développeur Web
Inscription : janvier 2004
Messages : 9 050
Détails du profil
Informations personnelles :
Nom : Josselin
Âge : 29
Localisation : France, Rhône (Rhône Alpes)

Informations professionnelles :
Activité : Développeur Web

Informations forums :
Inscription : janvier 2004
Messages : 9 050
Points : 12 181
Points : 12 181
Un float:left sur l'élément img et sur l'élément ul, plus un margin-left, genre de 20px sur l'élément ul ne te convient pas ?

Si tu as design qui nécessite un positionnement au pixel près de ces éléments, on ne pourra pas t'aider sans une page en ligne.
Bisûnûrs est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 02/03/2011, 12h46   #3
Invité de passage
 
Inscription : mars 2011
Messages : 5
Détails du profil
Informations forums :
Inscription : mars 2011
Messages : 5
Points : 1
Points : 1
Hello Bisûnûrs !

Merci de ta réponse, j'ai réussi à faire avec les floats et jouer un peu avec les margin.

J'ai juste une petite question, comment puis-je procéder si je veux centrer les deux éléments ?
Beatboxxy est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 02/03/2011, 14h00   #4
Modérateur
 
Avatar de Bisûnûrs
 
Josselin
Développeur Web
Inscription : janvier 2004
Messages : 9 050
Détails du profil
Informations personnelles :
Nom : Josselin
Âge : 29
Localisation : France, Rhône (Rhône Alpes)

Informations professionnelles :
Activité : Développeur Web

Informations forums :
Inscription : janvier 2004
Messages : 9 050
Points : 12 181
Points : 12 181
Tu peux englober les deux éléments d'un div, qui prend pour largeur la somme des largeur de ton logo et de ton menu. Tout en mettant un margin:auto à ce div.
Bisûnûrs est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 02/03/2011, 20h24   #5
Invité de passage
 
Inscription : mars 2011
Messages : 5
Détails du profil
Informations forums :
Inscription : mars 2011
Messages : 5
Points : 1
Points : 1
Merci beaucoup Bisûnûrs ! Problème résolu, encore merci pour ton aide !
Beatboxxy est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 15h02.


 
 
 
 
Partenaires

Hébergement Web