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 :

[CSS] li et z-index


Sujet :

Positionnement en CSS avec z-index

  1. #1
    Membre averti
    Inscrit en
    Août 2003
    Messages
    42
    Détails du profil
    Informations forums :
    Inscription : Août 2003
    Messages : 42
    Par défaut [CSS] li et z-index
    le css :

    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
     
    ul li {
           margin-left:-13px;
           float:left
    }
     
    li#menu1 {
    	width:97px;
    	z-index:100;
    }
     
    li#menu1 a{
    	background:url(../images/menu_1.gif) top left no-repeat;	
    }
     
    li#menu1 a:hover{
    	background:url(../images/menu_1_f2.gif) top left no-repeat;	
    }
     
    li#menu2 {
    	width:141px;
    	z-index:1;
    }
    le bout du html

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    <ul>
    		<li id="menu1"><a href="#"><img src="images/spacer.gif" /></a></li>
    		<li id="menu2"><a href="#"><img src="images/spacer.gif" /></a></li>
    		<li id="menu3"><a href="#"><img src="images/spacer.gif" /></a></li>
    		<li id="menu4"><a href="#"><img src="images/spacer.gif" /></a></li>
    	</ul>
    le probleme c'est que le li#menu1 reste tjrs en dessous de li#menu2

    y a t il une solution

    merci

  2. #2
    Membre chevronné Avatar de Perceval
    Homme Profil pro
    Responsable de projet fonctionnel
    Inscrit en
    Mars 2003
    Messages
    355
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Responsable de projet fonctionnel
    Secteur : Distribution

    Informations forums :
    Inscription : Mars 2003
    Messages : 355
    Par défaut
    C'est bien d'avoir le problème.... mais si on ne sait pas ce que tu veux faire exactement ca va êter difficile de donner des solutions...

  3. #3
    Membre averti
    Inscrit en
    Août 2003
    Messages
    42
    Détails du profil
    Informations forums :
    Inscription : Août 2003
    Messages : 42
    Par défaut
    Bon, le but de ce code c'est simple:

    je veux avoir ceci :


    mais le resultat du code c'est ceci :

  4. #4
    Membre chevronné Avatar de Perceval
    Homme Profil pro
    Responsable de projet fonctionnel
    Inscrit en
    Mars 2003
    Messages
    355
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Responsable de projet fonctionnel
    Secteur : Distribution

    Informations forums :
    Inscription : Mars 2003
    Messages : 355
    Par défaut
    euh...... ca n'affiche rien... les liens ne doivent pas être bons....

  5. #5
    Membre éclairé Avatar de glloq8
    Inscrit en
    Novembre 2002
    Messages
    298
    Détails du profil
    Informations personnelles :
    Âge : 44

    Informations forums :
    Inscription : Novembre 2002
    Messages : 298
    Par défaut
    En faisant clic droit afficher l'image, moi je les ai eu !

  6. #6
    Membre averti
    Inscrit en
    Août 2003
    Messages
    42
    Détails du profil
    Informations forums :
    Inscription : Août 2003
    Messages : 42
    Par défaut
    Copier l'adresse de l'image et visualiser le sur IE ou FF, et tu verras, ça ne pese que 2 ko chacun

  7. #7
    Membre averti
    Inscrit en
    Août 2003
    Messages
    42
    Détails du profil
    Informations forums :
    Inscription : Août 2003
    Messages : 42
    Par défaut
    Et bien, merci pour tous.

    la solution etait de mettre les li en position:absolute, et de les placer un à un en specifiant le style left

    8)

  8. #8
    Membre éclairé Avatar de glloq8
    Inscrit en
    Novembre 2002
    Messages
    298
    Détails du profil
    Informations personnelles :
    Âge : 44

    Informations forums :
    Inscription : Novembre 2002
    Messages : 298
    Par défaut
    C'est cool, en disant qu'on ne voit pas les images, le problème est résolu !

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [css] position/float/z-index Firefox
    Par marc99 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 19/09/2006, 23h40
  2. [css] ordre des z-index
    Par troumad dans le forum Mise en page CSS
    Réponses: 6
    Dernier message: 02/08/2006, 11h13
  3. [CSS] Positionement relatif et z-index
    Par CAML dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 31/05/2006, 09h37
  4. CSS problème avec z-index sous mozilla
    Par stringdrid dans le forum Mise en page CSS
    Réponses: 1
    Dernier message: 16/05/2006, 09h59
  5. [CSS]Problème de z-index
    Par Pill_S dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 20/02/2006, 20h03

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