IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Aligner plusieurs DIV


Sujet :

Positionnement en CSS

  1. #1
    Membre éclairé Avatar de PtitGénie
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2007
    Messages
    231
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2007
    Messages : 231
    Par défaut Aligner plusieurs DIV
    Bonjour à tous ^^

    Désolé, je sais que c'est un question qui revient souvent, mais impossible de trouver une réponse qui fonctionne :/

    J'essaye d'aligner X blocs DIV (12 exactement) horizontalement dans une autre DIV qui les englobe.

    Voilà une capture de ce que ça donne sous IE :

    (je veux aligner les DIV avec la bordure épaisse noire)



    Voici mon code...

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    	<body>
    		<div id="en_tete">
    		</div>
     
    		<div id="menu">		
    			<div id="element_menu"><h2>Lien</h2></div>	
    			<div id="element_menu"><h2>Lien2</h2></div>	
    			<div id="element_menu"><h2>Lien3</h2></div>	
    		</div>
     
    		<div id="corps">
                                 blabla
    		</div>
     
    	</body>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    			/* L'en-tête */
     
    			#en_tete
    			{
    				width:900px;
    				height:100px;
    				background-image:url("banniere.png");
    				background-color:#626262;
    				background-repeat:no-repeat;
    				margin-bottom:10px;
    			}
     
     
    			/* Le menu */
     
    			#menu
    			{
    				width:900px;
    				background-color:#626262;
    				background-repeat:no-repeat;
    				margin-bottom:10px;
    			}
     
    			#element_menu
    			{
    				background-color:#626262;
    				background-image:url("motif.png");
    				background-repeat:repeat-x;
    				width:70px;
    				border:5px solid black;
    			}
    Alors, j'ai lu par exemple de mettre "float:left" dans #element_menu. Ca fonctionne parfaitement sous IE, mais sous Mozilla non :/

    IE :


    Mozilla :


    Merci d'avance pour votre aide...

  2. #2
    Membre chevronné Avatar de desert
    Profil pro
    Inscrit en
    Mai 2007
    Messages
    414
    Détails du profil
    Informations personnelles :
    Localisation : Belgique

    Informations forums :
    Inscription : Mai 2007
    Messages : 414
    Par défaut
    Bonjour,
    Cela n'a rien à voir mais il faut savoir qu'un id doit rester unique. Or tu définies plusieurs id portant le même nom. Ce qui constitue une erreur. Il faut utiliser les classes à la place.

    Pour résoudre ton problème : ajouter
    au conteneur parent des éléments flottants (ici le div #menu).
    Si tu veux en savoir plus : http://www.blog-and-blues.org/articl...s_de_formatage

Discussions similaires

  1. Alignement de plusieurs div entre eux
    Par polo66 dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 29/01/2009, 12h51
  2. script php et plusieurs div
    Par bébé dans le forum Langage
    Réponses: 4
    Dernier message: 02/10/2005, 21h02
  3. [CSS]Aligner les div suivant la résolutation d'écran
    Par nebule dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 09/09/2005, 11h00
  4. Afficher, cacher plusieurs divs
    Par Buku dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 18/03/2005, 10h28

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo