28172 sujets

CSS et mise en forme, CSS3

Hello,

J'ai un problème avec une div "spacer" (propriété clear) qui est sensé pousser mon conteneur, celle-ci ne marche pas alors que je l'avais déjà utilisée plusieurs fois dans d'autres pages :

<style type="text/css">
div#contenu
{
	margin: 30px 30px 30px 30px;
	padding: 15px;
	border: 1px solid #27167d;
}
div#contenu div#bloc
{ 
	height: 140px;  
    width: 350px; 
	padding: 15px;
    border: 1px solid #b5aeb6; 
	position : absolute;
}

.mdj
{
	margin: 0 0 0 50px;
}

.news
{
	margin: 0 0 0 500px;
}

.spacer {
  clear: both;
}
</style>
<body>
<div id="contenu">
	<div id="bloc" class="mdj">
		Message du jour
	</div>
	<div id="bloc" class="news">
		22/07/09 - Bla bla bla...<br />
		02/07/09 - Blo blo blo ...
	</div>
	<div class="spacer"> </div>
</div>
</body>

Modifié par Relax (11 Aug 2009 - 16:09)
Salut,

la technique du spacer (et donc de la propriété clear) n'est utile qu'avec les éléments flottants or les tiens sont en position absolue !

D'ailleurs :
* pourquoi sont-ils en position absolue ? (Re)lire le Guide de survie du positionnement CSS et notamment les mises en garde concernant ce positionnement.
* un id doit être unique dans un document.
Modifié par Heyoan (09 Aug 2009 - 10:38)