Problème pour centrer mon site html/css
lacja
-
referencement-google Messages postés 6 Date d'inscription Statut Membre Dernière intervention -
referencement-google Messages postés 6 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous,
J'ai tenter en vain toutes les techniques trouver sur le web afin de centrer mon site, mais pas moyen, rien ne fonctionne, il reste bloqué sur la gauche ... sous firefox.
Voici mon code CSS (le "container" inclut toute ma page entre les deux balises body). J'y ai mis tout le code css, car peut-être le problème vient de là ?
CSS :
* {
margin: 0px;
padding: 0px;
border: none;
}
body {
height: 100%;
margin: 0;
background-image: url(images/background.png);
background-repeat: repeat-x;
background-color: #961539;
color: #000;
font-family: "Helvetica LT Std";
}
#container {
position: absolute;
width: 1280px;
float: left;
margin-left: auto;
margin-right: auto;
}
#sidebar {
float: left;
width: 296px;
height: 703px;
}
#logo {
float: left;
width: 296px;
height: 132px;
padding-top: 0px;
}
#logo img {
padding-top: 15px;
}
#menu {
float: left;
background-image: url(images/back_menu.png);
color: #cecece;
}
#menu ul {
width: 296px;
height: 480px;
margin-top: 7px;
font-size: 14px;
line-height: 24px;
color: #3e0015;
background-image: none;
}
#menu ul li {
text-align: right;
margin-right: 38px;
list-style-type: none;
}
#menu ul li a {
color: #cecece;
text-decoration: none;
}
#menu ul li a:hover {
color: #3e0015;
}
#menu ul li a:uppercase {
color: #3e0015;
}
#newsletter {
float: left;
width: 296px;
height: 86px;
background-image: url(images/newsletter_box.png);
text-align: right;
color: #cecece;
}
#newsletter ul {
list-style-type:none;
margin-right: 35px;
margin-top: 5px;
}
#fond {
float: left;
margin-left: 25px;
background-image: url(images/blank.png);
background-repeat:repeat-y;
}
Merci !
J'ai tenter en vain toutes les techniques trouver sur le web afin de centrer mon site, mais pas moyen, rien ne fonctionne, il reste bloqué sur la gauche ... sous firefox.
Voici mon code CSS (le "container" inclut toute ma page entre les deux balises body). J'y ai mis tout le code css, car peut-être le problème vient de là ?
CSS :
* {
margin: 0px;
padding: 0px;
border: none;
}
body {
height: 100%;
margin: 0;
background-image: url(images/background.png);
background-repeat: repeat-x;
background-color: #961539;
color: #000;
font-family: "Helvetica LT Std";
}
#container {
position: absolute;
width: 1280px;
float: left;
margin-left: auto;
margin-right: auto;
}
#sidebar {
float: left;
width: 296px;
height: 703px;
}
#logo {
float: left;
width: 296px;
height: 132px;
padding-top: 0px;
}
#logo img {
padding-top: 15px;
}
#menu {
float: left;
background-image: url(images/back_menu.png);
color: #cecece;
}
#menu ul {
width: 296px;
height: 480px;
margin-top: 7px;
font-size: 14px;
line-height: 24px;
color: #3e0015;
background-image: none;
}
#menu ul li {
text-align: right;
margin-right: 38px;
list-style-type: none;
}
#menu ul li a {
color: #cecece;
text-decoration: none;
}
#menu ul li a:hover {
color: #3e0015;
}
#menu ul li a:uppercase {
color: #3e0015;
}
#newsletter {
float: left;
width: 296px;
height: 86px;
background-image: url(images/newsletter_box.png);
text-align: right;
color: #cecece;
}
#newsletter ul {
list-style-type:none;
margin-right: 35px;
margin-top: 5px;
}
#fond {
float: left;
margin-left: 25px;
background-image: url(images/blank.png);
background-repeat:repeat-y;
}
Merci !
A voir également:
- Problème pour centrer mon site html/css
- Site de telechargement - Accueil - Outils
- Site comme coco - Accueil - Réseaux sociaux
- Site pour vendre des objets d'occasion - Guide
- Site pour partager des photos - Guide
- Quel site remplace coco - Accueil - Réseaux sociaux
4 réponses
ton conteneur fait 1280 de large.. est ce bien raisonable ?
en float left il flotte donc a gauche mais alors en absolute il est hors flux donc si tu préfère il se fou de ce qui l'entoure et donc ne se centrera pas
revien sur une largeur compatible déja (900 par exemple) et enleve le float et le positionement.
ensuite un margin : auto; fera tres bien l'affaire
pas besoin de margin 0 dans le body tu le spécifie juste avant dans le " * "
la police définie n'a pas d'alternatives possibles ?
en float left il flotte donc a gauche mais alors en absolute il est hors flux donc si tu préfère il se fou de ce qui l'entoure et donc ne se centrera pas
revien sur une largeur compatible déja (900 par exemple) et enleve le float et le positionement.
ensuite un margin : auto; fera tres bien l'affaire
pas besoin de margin 0 dans le body tu le spécifie juste avant dans le " * "
la police définie n'a pas d'alternatives possibles ?
Salut !
Merci pour les réponses ! Je ne suis pas sur mon ordi durant le week-end, je ne pourrais hélas savoir si cela fonctionne ou pas.
En ce qui concerne la largeur, ce n'est pas définitif, et oui je pensais adapter le site pour de plus faibles résolution.
Pour la police, je suis une maquette photoshop, et donc oui la helvetica est la police à utiliser ... ça peut poser problème ?
Merci encore pour les réponses !
Et par la suite, j'aimerais que le contenu soit dynamique et modifiable par le biais d'une interface d'administration, le plus simple serait de passer par joomla! non ?
A+
Merci pour les réponses ! Je ne suis pas sur mon ordi durant le week-end, je ne pourrais hélas savoir si cela fonctionne ou pas.
En ce qui concerne la largeur, ce n'est pas définitif, et oui je pensais adapter le site pour de plus faibles résolution.
Pour la police, je suis une maquette photoshop, et donc oui la helvetica est la police à utiliser ... ça peut poser problème ?
Merci encore pour les réponses !
Et par la suite, j'aimerais que le contenu soit dynamique et modifiable par le biais d'une interface d'administration, le plus simple serait de passer par joomla! non ?
A+