Merci infiniment

Fait des essais au lieu de t'aouver vaincu...!
Un peu d'énergie que diable!
Si tu met la valeur à Zero, tu remarqueras que le décalage n'est plus...
Et avec le mot firstchild, tu peux envisager que celà correponde au premier enfant de l'élément "contenu", après le signe > je te l'accorde on peut pas deviner.... mais chercher?
http://www.yoyodesign.org/doc/w3c/css2/selector.html#child-selectors

Donc conclusion, que fait ce vout de code? ;)

bonne question

J'en sais rien, j'ai repris le code de template sur Internet.
et ce bout de code je ne le comprends pas.

Enfin je me doute qu'on met une marge au premier enfant de contenu

J'ai enlever ce code, et c'est bien aligner.

Merci :D

Humhum... et ça[code]#contenu > :first-child {
margin-top: 10px;

} [/code]C'est quoi?

XHTML


[code]

/* --- POSITIONNEMENT --- */

/* Page */
html, body {
height: 100%; /* Voir -> Note 1 ci-dessous */
}
body {
padding: 0;
}
#global {
min-height: 100%; /* -> 1 */
width: 780px;
overflow: hidden; /* -> 2 */
margin-left: auto;
margin-right: auto; /* -> 3 */
}

/* En-tête */
#entete {
padding: 15px 20px 10px 20px;
}
#entete h1 {
margin: 0;
}
#entete h1 img {
float: left;
margin: 7px 20px 10px 0;
}
#entete .sous-titre {
margin: 4px 0 15px 0;
}

/* Menu de navigation */
#navigation {
padding: 12px 15px;
}
#navigation ul {
margin: 0;
list-style: none;
text-align: center;
}
#navigation li {
display: inline;
}
#navigation a {
padding: 6px;
line-height: 1.5;
font-size: .9em;
text-decoration: none;
}

/* Contenu */
#contenu {
padding: 10px 20px;
}

#contenu > :first-child {
margin-top: 10px;

}

#contenu p, #contenu li {
line-height: 1.5;
}

/* Pied de page */
#pied {
padding: 15px 20px;
font-size: .85em;
}
#pied p {

margin: .5em 0;
}
#copyright {
text-align: left;
font-size: 1em;
}
/* --- ajout CSS Marcgrenier--- */
#contenu {
overflow: hidden;
background-color:#999999;
}

#contenu #left {
width: 50%;
float: left;
background-color: #f00;
height: 300px;
}

#contenu #right {
width: 30%;
float: left;
background-color: #000;
height: 300px;
}
}

#entete h1 {
color:#fff;
}


[/code]

et le html? ;)

CSS


[code]

/* --- POSITIONNEMENT --- */

/* Page */
html, body {
height: 100%; /* Voir -> Note 1 ci-dessous */
}
body {
padding: 0;
}
#global {
min-height: 100%; /* -> 1 */
width: 780px;
overflow: hidden; /* -> 2 */
margin-left: auto;
margin-right: auto; /* -> 3 */
}

/* En-tête */
#entete {
padding: 15px 20px 10px 20px;
}
#entete h1 {
margin: 0;
}
#entete h1 img {
float: left;
margin: 7px 20px 10px 0;
}
#entete .sous-titre {
margin: 4px 0 15px 0;
}

/* Menu de navigation */
#navigation {
padding: 12px 15px;
}
#navigation ul {
margin: 0;
list-style: none;
text-align: center;
}
#navigation li {
display: inline;
}
#navigation a {
padding: 6px;
line-height: 1.5;
font-size: .9em;
text-decoration: none;
}

/* Contenu */
#contenu {
/*padding: 10px 20px; */
margin: 0px;
padding: 0;

}

#contenu > :first-child {
margin-top: 10px;

}

#contenu p, #contenu li {
line-height: 1.5;
}

/* Pied de page */
#pied {
padding: 15px 20px;
font-size: .85em;
}
#pied p {

margin: .5em 0;
}
#copyright {
text-align: left;
font-size: 1em;
}
/* --- mes CSS --------------------------------------/
#contenu {
overflow: hidden;
background-color:#999999;
}

#contenu #left {
width: 50%;
float: left;
background-color: #f00;
height: 300px;
}

#contenu #right {
width: 30%;
float: left;
background-color: #000;
height: 300px;
}
}

#entete h1 {
color:#fff;
}

[/code]

Fait voir les codes complets...

Effectivement ça fonctionne bien, mon ordi a du bugguer.

Par contre quand je remets le code dans mon div conteneur de mon site, j'ai un décalage entre mes
2 div gauche et droite (il ne sont pas alignés horizontalement) ?

pour moi ça fonctionne bien avec[code]#conteneur {
border: 1px solid blue;
overflow: hidden;
}

#conteneur #left {
width: 50%;
float: left;
height: 100px;
background-color:#f00;
}

#conteneur #right {
width: 50%;
float: left;
height: 100px;
background-color:#000;
} [/code]...

Merci infiniment,

il sert à quoi l' overflow: hidden

Code HTML
[code]<div id="conteneur">
<div></div>
<div></div>
</div>[/code]
CSS
[code]#conteneur {
border: 1px solid;
overflow: hidden;
}
#conteneur div {
width: 50%;
float: left;
}[/code]
Correctif CSS pour IE 6
[code]#conteneur {
height: 1%;
}[/code]

Bonsoir,

Je voudrais savoir comment je peux diviser un bloc div en 2 cellules, sans utiliser
table, j'ai essayé avec 2 div l'un étant en float left, et l'autre avec un margin-left
de la largeur de mon div de gauche, mais j'ai des décalages !

notez que mon div conteneur est dans le flux normal.