Aller au contenu

Sujets conseillés

Posté

bonjour a tous voila mon probleme, jai un menu en CSS fait pour faire un double rollover image, seulement la contrainte est qu'il faut que je mette le meme margin top au 5 éléments du menu, du coup je dois leur attribuer un width different et lesmettre sur des z-index pour définir la priorité des calques! mais IE (produit de microbidule) pose probleme alors que firefox affiche tout correctement

voici la page en question :

C'est ICI

voilci mon CSS :

*{
margin:0;
padding:0;
}

html,body{
background: url(img-fonds/fond-accueil.gif) no-repeat;
margin:0px;
padding:0px;
}

a:hover {
background: none;

}

#logo{
padding:0px;
position:absolute;
background: url(img-accueil/logo_adimages.gif) no-repeat;
height:257px;
width:355px;
margin-top:-10px;
margin-left:80px;
}

a#contact{
position:absolute;
background: url(./images/contact-a.gif) no-repeat;
height:43px;
width:260px;
margin-top:451px;
margin-left:404px;
text-decoration:none;
}

a#contact:hover{
background: url(./images/contact-b.gif) no-repeat;
}

#toute_com{
position:absolute;
background: url(./img-accueil/toute_com.gif) no-repeat;
height:69px;
width:559px;
margin-top:494px;
margin-left:255px;
}

ul#menu_ad li{  /*POUR le menu*/
list-style-type:none;
display:inline;
position:absolute;
}

ul#menu_ad li a {
position:absolute;
float:left;
text-indent:-10000px;
width: 260px;
}

#nav{
padding: 0;
position:absolute;
}

#nav ul{
position:absolute;
margin:0;
padding:0;
list-style: none;
}

#nav li {
position:absolute;
background-repeat: no-repeat;
}

#nav a { /* if background is on a:link IE6 won't display properly  */
position:absolute;
background-repeat: no-repeat; /* height and or width in here will stop main image change in IE5 */
color: yellow;
font-family: "Arial Black", sans-serif;
text-align: center;
width: 124px;
height:120px;

/*height or width in here will stop main image change in IE5 Win
luckily, line-height is OK! - hidden from IE5 Mac see below
a must be block to display background-image in IE Win
 - but also needs to be hidden from IE5 Mac see below */
}

#nav a/*Comment hack to hide this from IE5 - needed to extend link over button image in IE6 */{
height:100px;
width: 122px;
position:absolute;
}


#nav a img {
position:absolute;
width: 414px; /* IE5 Win can't dynamically change size - Adon't use 0px to hide */
height: 198px;
float:left;
border: 0 none;
margin-top:60px;
visibility: hidden;
margin-left:500px;
top:-300px;
left:0px;
}

#nav a:hover img {
position:absolute;
visibility: visible;
background: none;

}

/* commented backslash hack v2 - hide rules from IE5 Mac \*/
#nav a {
position:absolute;
padding: 0;
display: block;
}

#nav li {
position:absolute;
margin-top:0;
margin-bottom:0;
width: 80px;
}
/* end hack */



a#menu1{
z-index:5;
position:absolute;
padding: 0;
height:123px;
width:255px;
margin-top:305px;
background-image:  url(img-navig/bout-siteweb-a.gif);
margin-left:0px;
background-position:right;

}

a#menu2{
z-index:4;
position:absolute;
height:123px;
width:438px;
margin-top:305px;
background-image:  url(img-navig/bout-studio-a.gif);
margin-left:0px;
background-position:right;

}

a#menu3{
z-index:3;
position:absolute;
height:123px;
width:597px;
margin-top:305px;
background-image:  url(img-navig/bout-enseignes-a.gif);
margin-left:0px;
background-position:right;

}

a#menu4{
z-index:2;
position:absolute;
height:123px;
width:757px;
margin-top:305px;
background-image:  url(img-navig/bout-imprimerie-a.gif);
margin-left:0px;
background-position:right;

}

a#menu5{
z-index:0;
position:absolute;
height:123px;
width:935px;
margin-top:305px;
margin-left:0px;
background-image:  url(img-navig/bout-conseils-a.gif);
background-position:right;

}

a#menu1:hover{
background-image:  url(img-navig/bout-siteweb-b.gif);
}
a#menu2:hover{
background-image:  url(img-navig/bout-studio-b.gif);
}
a#menu3:hover{
background-image:  url(img-navig/bout-enseignes-b.gif);
}
a#menu4:hover{
background-image:  url(img-navig/bout-imprimerie-b.gif);
}
a#menu5:hover{
background-image:  url(img-navig/bout-conseils-b.gif);
}


#bienvenue{
background-image:  url(img-navig/bloc-texte-bienvenue.gif);
width: 414px;    
height: 198px;
position: absolute;
border: 0 none;
margin-top:60px;
margin-left:500px;
}

dsl pour la longueur mais je ne sais pas d'ou vien mon probleme ! aidez moiiii svpp

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...