28173 sujets

CSS et mise en forme, CSS3

Bonjours a tous,

voila j'ai un petit probleme, je souhaiterais afficher une conteneur en fonction du conteneur précédent j'explique

---------------
| Conteneur1 |
---------------
(10px de séparation)
---------------
| Conteneur2 |
---------------
je souhaiterais que mon conteneur2 saffiche toujours à 10px du conteneur1 quelque soit la hauteur du 1er conteneur.
Mais je n'ai pas trouver comment faire, j'ai teste position: aboslute, relative, static,.. mais rien ne marche

Voila merci pour vitre aide
Salut dbzes59 Smiley cligne ,

Le comportement que tu décris est celui par défaut des div qui ont un rendu de type bloc (voir le tuto Comprendre la structure HTML et le rendu CSS des balises : bloc et en-ligne). Il suffit juste de rajouter un margint-top:10px; au second div.

Tu pourrais faire par exemple :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

	<title>Conteneurs</title>

	<style type="text/css" media="screen,projection"><!--
		#cont1 {
			background-color:blue;
			padding: 15px;
		}
		
		#cont2 {
			background-color:purple;
			padding: 15px;
			margin-top: 10px;
		}
	--></style>
</head>
<body>
<div id="cont1">
	<p>Du texte</p>
	<p>Encore du texte</p>
</div>
<div id="cont2">
	<p>Du texte</p>
	<p>Encore du texte</p>
</div>
</body>
</html>

Les tutoriels Bases et indispensables devraient également t'intéresser Smiley smile !

A+
Modifié par Heyoan (21 Jan 2008 - 23:50)