18073 sujets

Questions générales et questions de débutants

Je ne comprends pas le comportement d'un background-color [résolu]

Bonjour, une question de profonde incomprehension :

Remarque : je ne cherche pas un trick pour y arriver, ca je peux
le faire en utilisant un spacer.
Je voudrais savoir pourquoi ce phenomene arrive, il me semble que j'ai rate quelque chose.....


Si j'utilise une div container dans laquelle j'insere deux blocs flottant,
pourquoi la couleur de fond du containeur n'est pas affichée sur toute la hauteur / largeur de celui ci ???

exemple :


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<title>mon titre</title>
		<style type="text/css">
			body{
				color:#fff;
			}

			#container{ background-color: #000; }

			#menu{ background-color: #f00; float:left; }

			#corps{ background-color: #0f0; float:left; }

	  	</style>

	</head>

	<body>
		<div id="container">
			<div id="menu">
				Le menu<br />
				Le menu<br />
				Le menu<br />
			</div>
			<div id="corps">
				Le corps<br />
			</div>
		</div>
	</body>

</html>


Pourquoi n'ai je pas un fond noir qui aille au moins jusqu'en bas du menu ?
Notez que j'ai la meme incomprehension si je mets un border au container,
je ne vois s'afficher qu'une ligne en haut, sur toute la largeur de l'ecran...
mais rien ni a gauche ni a droite, ni en bas....

Merci d'avance a toute tentative d'explication....
Modifié par stanbul (20 Jan 2006 - 21:58)
Bonjour.

Les blocs placés en flottant sortent du flux normal de la page, le conteneur ne s'étire donc pas.
Une des solutions possibles est d'appliquer un overflow: auto; sur le conteneur.
Sujet clos
Aller à