bonjour

j'ai une page (http://www.lepuitsdutresor.com/lastournew/) qui passe la validation en css et (X)HTML , sur ie elle est nickel, le pb c'est que lorsque je la visionne sur firefox tout est décalé le pb vient de ma <div id="centre"> , ce qu'elle contient remonte vers le haut(div image,p,h3) et elle a des espaces entre les div header et pied.
je suis bloqué je n arrive pas à déterminer si c'est le "centre " qui est mal positionné ou si c'est ce qu il contient

merci d avance pour votre aide

css liée à la page
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0;
padding: 0;
background-color: #d5d6d8;
}

#conteneur {
position: absolute;
width: 800px;
left: 50%;
margin-left: -375px;
}


#header {
height: 100px;
width: 800px;
background-image: url(1photos/trait.gif);
background-repeat: no-repeat;
background-position: center;
background-color: #FFFFFF;
}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

#menu {
position: absolute;
top: 42px;
left: 80px;
z-index:100;
width: 100%; /* prcision pour Opera */
}
#menu dl {
float: left;
margin-left:10px;
width: 10em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: normal;
font-size: 10px;
color:black;
background: #FFFFFF;
border: 1px solid #CE2020;
}
#menu dd {
display: none;
border: 1px solid #CE2020;

}
#menu li {
text-align: center;
font-weight: normal;
font-size: 10px;
color:black;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}

#centre {
z-index: 1;
height:369px;
width:800px;
background-color:#FFFFFF;
background-image: url(1photos/accueil.gif);
}

#pied {
height: 126px;
background-color: #FFFFFF;
background-image: url(1photos/pied.gif);
}


.menubas {
list-style-type: none;
margin-left:190px;
margin-top: 55px;
}
.menubas li {
display: inline;
}
.menubas a {
margin-left:20px;
color: #000000;
text-decoration: none;
}
.menubas a:hover {
text-decoration: none;
}

.logo {
float:right;
margin-right: 10px;
margin-top: -20px;
border:0;
height:46px;
width:89px;

}
h1{
font-family:"Fairfield LH CaptionMedium";
font-size: 23px;
color: #CE2020;
text-align: left;
margin-left: 20px;

}
h2{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #CE2020;
text-align: right;
margin-right:300px;
margin-top: -23px;
}
h3{
font-family:"Fairfield LH CaptionMedium";
font-size: 15px;
color: #CE2020;
text-align:left;
margin-left:500px;
margin-top: 65px;
}
p{
width:250px;
margin-left:100px;
}

#image{
position:relative;
margin-top:-155px;
margin-left:420px;
}
Salut et bienvenue,

Faut juste éditer ton message avec le bouton en haut à droite et dans la fenêtre d'édition tu verras en bas un bouton code qui sert à insérer des balises pour présenter proprement ton code. Lire les règles et aide du forum!
Modifié par zanzibar (26 Jan 2006 - 19:33)
akhesa a écrit :
bonjour

j'ai une page (http://www.lepuitsdutresor.com/lastournew/) qui passe la validation en css et (X)HTML , sur ie elle est nickel, le pb c'est que lorsque je la visionne sur firefox tout est décalé le pb vient de ma <div id="centre"> , ce qu'elle contient remonte vers le haut(div image,p,h3) et elle a des espaces entre les div header et pied.
je suis bloqué je n arrive pas à déterminer si c'est le "centre " qui est mal positionné ou si c'est ce qu il contient

merci d avance pour votre aide

css liée à la page
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0;
padding: 0;
background-color: #d5d6d8;
}

#conteneur {
position: absolute;
width: 800px;
left: 50%;
margin-left: -375px;
}


#header {
height: 100px;
width: 800px;
background-image: url(1photos/trait.gif);
background-repeat: no-repeat;
background-position: center;
background-color: #FFFFFF;
}

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

#menu {
position: absolute;
top: 42px;
left: 80px;
z-index:100;
width: 100%; /* prcision pour Opera */
}
#menu dl {
float: left;
margin-left:10px;
width: 10em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: normal;
font-size: 10px;
color:black;
background: #FFFFFF;
border: 1px solid #CE2020;
}
#menu dd {
display: none;
border: 1px solid #CE2020;

}
#menu li {
text-align: center;
font-weight: normal;
font-size: 10px;
color:black;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}

#centre {
z-index: 1;
height:369px;
width:800px;
background-color:#FFFFFF;
background-image: url(1photos/accueil.gif);
}

#pied {
height: 126px;
background-color: #FFFFFF;
background-image: url(1photos/pied.gif);
}


.menubas {
list-style-type: none;
margin-left:190px;
margin-top: 55px;
}
.menubas li {
display: inline;
}
.menubas a {
margin-left:20px;
color: #000000;
text-decoration: none;
}
.menubas a:hover {
text-decoration: none;
}

.logo {
float:right;
margin-right: 10px;
margin-top: -20px;
border:0;
height:46px;
width:89px;

}
h1{
font-family:"Fairfield LH CaptionMedium";
font-size: 23px;
color: #CE2020;
text-align: left;
margin-left: 20px;

}
h2{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #CE2020;
text-align: right;
margin-right:300px;
margin-top: -23px;
}
h3{
font-family:"Fairfield LH CaptionMedium";
font-size: 15px;
color: #CE2020;
text-align:left;
margin-left:500px;
margin-top: 65px;
}
p{
width:250px;
margin-left:100px;
}

#image{
position:relative;
margin-top:-155px;
margin-left:420px;
}
Salut,
je doute de la validité de la valeur de cet attribu :
font-family:"Fairfield LH CaptionMedium";

Ce n'est pas une typo systeme, donc elle sera remplacée par une typo standard (par défaut du navigateur) chez celles et ceux qui ne possèdent pas la fairfield dans leur bibliothèque de font

Exemple typo "baton" :
font-family:Georgia, "Times New Roman", Times, serif;

ou encore pour une typo sans sérif :
font-family:Verdana, Tahoma, Arial, sans-serif;

Voilu Smiley cligne
Modifié par fredmac (09 Feb 2006 - 17:55)