28173 sujets

CSS et mise en forme, CSS3

Bonjour,
suite a la réalisation d'un script pour forum, j'essai de placer mes div de façon logique, cela dit j'ai dû faire une erreure quelques part car je n'arrive pas a faire en sorte que mon div nommé global entour ceux qui sont censé etre a l'interieur.
Enfin pour etre mieu compris voici le code css et html ainsi qu'une page d'exemple :

html :
<body>

<div id="global">
<div id="avatar">
<div id="pseudo">$pseudo</div>
image<br />image<br />image<br />image<br /></div>
<div id="message">
<div id="date">$date</div>
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
</div>

</div>
<div id="global2">
<div id="avatar2">
<div id="pseudo">$pseudo</div>
image<br />imagdde<br />image<br />image<br /></div>
<div id="message2">
<div id="date">$date</div>
Messadddddge<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
Message<br />Message<br />Message<br />Message<br />Message<br />
</div>

</div>
</body>



css:
#global {
background-color:yellow;
width:500px;
position:relative;
border:1px solid black;
}

#avatar {
background-color:green;
width:100px;
float:left;

}

#message {
background-color:red;
width:400px;
float:left;

}


#global2 {
background-color:yellow;
width:500px;
position:relative;
}

#avatar2 {
background-color:grey;
width:100px;
float:left;
}

#message2 {
background-color:purple;
width:400px;
float:left;
}

#pseudo {
border:1px solid black;
background-color:#cccccc;
}
#date {
border:1px solid black;
background-color:#cccccc;
}


la page d'exemple : http://chez.guizmo.free.fr/test/Nouveau%20dossier/


Merci pour vos éventuelles réponses.
À priori, ton div nécessite un contexte de formattage:
#global {overflow:auto}
Ceci dit, je ne vois pas bien où tu veux en venir avec ce mélange de positionnements relatifs et de flottants...
a écrit :
Ceci dit, je ne vois pas bien où tu veux en venir avec ce mélange de positionnements relatifs et de flottants...


Sans doute à cause d'une mauvaise compréhension des différents types de position?
Oryo a écrit :
Ceci dit, je ne vois pas bien où tu veux en venir avec ce mélange de positionnements relatifs et de flottants...


Sans doute à cause d'une mauvaise compréhension des différents types de position?
Effectivement :')