bonjour à tous,
je m'appelle joe, 22 ans, étudiant dans le multimédia et créateur de site à l'occasion...
j'ai suivi les tutorials pour créer une page tout bien en CSS, mais jai un soucis avec le resultat final. Sous firefox, nickel pile poil, mais sous IE ya un soucis avec des espacements, j'ai testé plusieurs trucs mais rien ne passe.... J'espere que qq'un pourra me guider...
Voici l'adresse de la page en question : www.apis-togo.org
Voici le code CSS que j'utilise :
et la decoupe de l'interface :
www.apis-togo.org/decoupage.jpg
merci d'avance!
joe
elsass frei
Modifié par elsassfrei (18 Jul 2005 - 19:00)
je m'appelle joe, 22 ans, étudiant dans le multimédia et créateur de site à l'occasion...
j'ai suivi les tutorials pour créer une page tout bien en CSS, mais jai un soucis avec le resultat final. Sous firefox, nickel pile poil, mais sous IE ya un soucis avec des espacements, j'ai testé plusieurs trucs mais rien ne passe.... J'espere que qq'un pourra me guider...
Voici l'adresse de la page en question : www.apis-togo.org
Voici le code CSS que j'utilise :
#header {
width: 848px;
height: 109px;
/*background-color: #660000;*/
}
#conteneur {
position: absolute;
width: 848px;
height: 539px;
left: 50%;
margin-left: -385px;
/*background-color:#FFCC00;*/
}
#centre {
width: 617px;
height: 396px;
overflow: auto;
background-image: url(images/makettev5_14.jpg);
margin-left: 222px;
margin-right: 9px;
}
#gauche {
position: absolute;
left:0;
width: 222px;
height: 429px;
}
#droite {
position: absolute;
right:0;
width: 9px;
height: 395px;
background-image: url(images/makettev5_15.jpg);
}
#pied {
margin-left: 222px;
width: 626px;
height: 34px;
background-image: url(images/makettev5_17.jpg);
}
#menuhaut{
width: 222px;
height: 193px;
background-image: url(images/makettev5_13.jpg);
}
#menubas{
width: 222px;
height: 236px;
background-image: url(images/association-humanitaire.jpg);
}
/******************************************
/**************************************** HEADER ***********************************************************************************/
.headerconteneur{
width: 848px;
height: 109px;
/*background-color: #33FF00;*/
margin: 0px;
padding: 0px;
}
.logo{
float:left;
width: 187px;
height: 75px;
background-image: url(../images/logo-association-afrique.jpg);
margin: 0px;
}
.header{
float:left;
width: 661px;
height: 75px;
background-image: url(../images/timbre-togo.jpg);
margin: 0px;
}
a.menu1{ /* définition de la classe "menu1" de la balise <a> */
float:left;
width: 99px;
height: 34px;
background-image: url(../images/accueil.jpg);
margin: 0px;
}
a.menu1:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-accueil.jpg); /* source de l'image d'arrivée */
}
a.menu2{
float:left;
width: 88px;
height: 34px;
background-image: url(../images/togo.jpg);
margin: 0px;
}
a.menu2:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-togo.jpg); /* source de l'image d'arrivée */
}
a.menu3{
float:left;
width: 170px;
height: 34px;
background-image: url(../images/association-apis.jpg);
margin: 0px;
}
a.menu3:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-association-apis.jpg); /* source de l'image d'arrivée */
}
a.menu4{
float:left;
width: 142px;
height: 34px;
background-image: url(../images/mission-humanitaire.jpg);
margin: 0px;
}
a.menu4:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-mission-humanitaire.jpg); /* source de l'image d'arrivée */
}
a.menu5{
float:left;
width: 129px;
height: 34px;
background-image: url(../images/volontaire-humanitaire.jpg);
margin: 0px;
}
a.menu5:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-volontaire-humanitaire.jpg); /* source de l'image d'arrivée */
}
a.menu6{
float:left;
width: 84px;
height: 34px;
background-image: url(../images/contact-association.jpg);
margin: 0px;
}
a.menu6:hover { /* définition de la classe "menu1" de la balise <a> au survol */
background-image: url(../images/ro-contact-association.jpg); /* source de l'image d'arrivée */
}
.menu7{
float:left;
width: 136px;
height: 34px;
background-image: url(../images/makettev5_12.jpg);
margin: 0px;
}
.spacer{
clear: left;
}
/**********************************************************************************************************************************/
p {margin: 0 0 10px 0;}
.Style1 { color: #663300;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}
et la decoupe de l'interface :
www.apis-togo.org/decoupage.jpg
merci d'avance!
joe
elsass frei

Modifié par elsassfrei (18 Jul 2005 - 19:00)