Bonjour à tous,
j'ai décidé comme beaucoup de me lancer dans la grande aventure du langage html et css afin de pouvoir intégrer par moi-même mes différents designs !

Je suis donc en train de coder une toute petite page "portail" pour rediriger entre mon blog et mon portfolio.
Voici l'adresse : http://www.rdesigns.fr/HTML5/index.html

Je joins le css car il est en externe. Je veux bien que vous me disiez si la manière de coder est propre ou si il faut que je change quelques habitudes...

body {
    background: url('images/fond.jpg') no-repeat fixed 50% 0;

}

h1 {
    text-align: center;
    color: #f30431;
    text-shadow: 0px 6px 0px #600516;
    text-transform: uppercase;
    font: bold 46px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    margin-top: 50px;
}
#global {
    float: none;
    display: inline ;
    margin-left: auto;
    margin-right: auto;
    margin-top: 50px;
    position:relative;
    width: 1000px;
    height: 400px;
    left: 50%;
}
div.blog {
    float: left;    
    width: 400px;
    height: auto;
    position: relative;
    left: 0;
    padding: 0;
    margin: 0;
}
div.folio {
    float: left;
    width: 400px;
    height: auto;
    left: 0;
    padding: 0;
    margin: 0;
}
div.descriptions {
    color: #f30431;
    text-decoration: none;
    text-transform: none;
    font: normal normal normal 11px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;

}
h2 {
    color: #f30431;
    text-transform: uppercase;
    text-shadow: 0px 2px 0px #000;
}
p {
    color: #FFF;
    text-align: justify;
    text-shadow: 0px 1px 1px #000;
    font-size: 11px;
    line-height: 13px;
}

Mais comme vous pouvez le voir, ma div "global" n'est pas centrée et je ne comprend pas pourquoi !
Si vous avez une solution, je suis preneur mais que si vous pouvez m'expliquer car j'ai vraiment envie d'avancer !

Merci d'avance à ce qui me liront !

2 réponses


Tu mélange un peu tout
LEFT ne sert que si tu as une position absolute sur ton élément (donc tu peux les supprimer)
sur div globale pourquoi mettre display inline ?
height:auto c'est le comportement par défaut donc tu peux le supprimer
une div n'a pas de padding/margin par défaut donc padding:0 et margin:0 ne sert à rien
pareil pour float:none;

Pour que ta div global soit centrer tu n'as pas besoin de marquer les margin-left et margin-right, mais tout simplement d'ajouter: 'margin: auto;'