Centrage
Résolu
philoubidou62
Messages postés
7
Date d'inscription
Statut
Membre
Dernière intervention
-
Gihef Messages postés 5150 Date d'inscription Statut Contributeur Dernière intervention -
Gihef Messages postés 5150 Date d'inscription Statut Contributeur Dernière intervention -
Bonjour,
Voilà mon problème : ma page html est centrée sous IE et pas sous Firefox . Quelqu'un peut il m'aider ? (Je débute en CSS)
Voici le css :
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
margin: auto;
}
#principal {
padding: 10px;
width: 900px;
border: 1px solid #9999FF;
left: auto;
text-align: center;
right: auto;
background-color: #FFFFFF;
bottom: auto;
}
#fond {
background-color: #CCCCCC;
height: 100%;
width: 100%;
padding-top: 10px;
position: relative;
}
.important {
font-weight: bold;
color: #660000;
}
#resume {
text-align: center;
margin-bottom: 10px;
padding: 4px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FF3300;
}
#menu {
text-align: left;
left: 0px;
top: 0px;
width: 900px;
margin-bottom: 10px;
position: relative;
}
#photo1 {
display: inline;
border: 1px solid #FF3300;
}
.photogauche {
float: right;
margin-right: 10px;
margin-top: 10px;
}
#pied {
text-align: center;
margin-top: 10px;
}
.texte {
line-height: 14px;
text-align: justify;
}
#acces {
position:absolute;
left:744px;
width:140px;
height:132px;
z-index:1;
background-color: #FF9966;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
top: 0px;
}
#page {
text-align: left;
margin-top: 20px;
}
.titre {
font-size: 200%;
background-color: #FFFFFF;
margin-bottom: 5px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FF6600;
width: 800px;
}
#encadre {
width: 200px;
padding: 5px;
float: left;
margin-right: 10px;
background-color: #C4C7EE;
border: 1px solid #330099;
}
#titrenews {
padding: 4px;
height: 100%;
}
#actu {
font-size: 12px;
background-color: #FF6600;
color: #FF6600;
padding: 1px;
border: 1px solid #FF3300;
}
#encadredroit {
width: 200px;
padding: 5px;
float: right;
background-color: #B8B8F8;
border: 1px solid #330099;
margin-left: 10px;
height: 20px;
}
#debouches {
background-color: #DFDFFF;
margin-right: 100px;
margin-left: 100px;
padding: 20px;
}
.txtactus {
padding-top: 0px;
padding-right: 2px;
padding-bottom: 0px;
padding-left: 6px;
}
Voilà mon problème : ma page html est centrée sous IE et pas sous Firefox . Quelqu'un peut il m'aider ? (Je débute en CSS)
Voici le css :
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
margin: auto;
}
#principal {
padding: 10px;
width: 900px;
border: 1px solid #9999FF;
left: auto;
text-align: center;
right: auto;
background-color: #FFFFFF;
bottom: auto;
}
#fond {
background-color: #CCCCCC;
height: 100%;
width: 100%;
padding-top: 10px;
position: relative;
}
.important {
font-weight: bold;
color: #660000;
}
#resume {
text-align: center;
margin-bottom: 10px;
padding: 4px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FF3300;
}
#menu {
text-align: left;
left: 0px;
top: 0px;
width: 900px;
margin-bottom: 10px;
position: relative;
}
#photo1 {
display: inline;
border: 1px solid #FF3300;
}
.photogauche {
float: right;
margin-right: 10px;
margin-top: 10px;
}
#pied {
text-align: center;
margin-top: 10px;
}
.texte {
line-height: 14px;
text-align: justify;
}
#acces {
position:absolute;
left:744px;
width:140px;
height:132px;
z-index:1;
background-color: #FF9966;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 5px;
top: 0px;
}
#page {
text-align: left;
margin-top: 20px;
}
.titre {
font-size: 200%;
background-color: #FFFFFF;
margin-bottom: 5px;
border-top-width: 1px;
border-right-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FF6600;
width: 800px;
}
#encadre {
width: 200px;
padding: 5px;
float: left;
margin-right: 10px;
background-color: #C4C7EE;
border: 1px solid #330099;
}
#titrenews {
padding: 4px;
height: 100%;
}
#actu {
font-size: 12px;
background-color: #FF6600;
color: #FF6600;
padding: 1px;
border: 1px solid #FF3300;
}
#encadredroit {
width: 200px;
padding: 5px;
float: right;
background-color: #B8B8F8;
border: 1px solid #330099;
margin-left: 10px;
height: 20px;
}
#debouches {
background-color: #DFDFFF;
margin-right: 100px;
margin-left: 100px;
padding: 20px;
}
.txtactus {
padding-top: 0px;
padding-right: 2px;
padding-bottom: 0px;
padding-left: 6px;
}
2 réponses
bonjour,
pourrais-tu nous préciser pour qu'elle classe ?
sinon peut-etre ton problème vient du fait que tu as des fois text-align: center; et des fois text-align: justify;
exemple ici
.texte {
line-height: 14px;
text-align: justify;
}
pourrais-tu nous préciser pour qu'elle classe ?
sinon peut-etre ton problème vient du fait que tu as des fois text-align: center; et des fois text-align: justify;
exemple ici
.texte {
line-height: 14px;
text-align: justify;
}
Bonjour,
Sans en voir plus, je suppose que le #principal sert à regrouper les autres.
Aors, essaye
++
Inutile de poster plusieurs fois la même question.
Merci de penser à utiliser le bouton indiqué.
--
Sans en voir plus, je suppose que le #principal sert à regrouper les autres.
Aors, essaye
#principal { padding: 10px; width: 900px; border: 1px solid #99f; background-color: #fff; margin : 0 auto; }
++
Inutile de poster plusieurs fois la même question.
Merci de penser à utiliser le bouton indiqué.
--
je te donne l'adresse http://annecridumi.neuf.fr
Merci de ton aide