28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous !

je me suis mis au css il n'y a pas très longtemps et je me trouve confronté à un problème d'affichage de background. (c'est peut-être une erreur de débutant...)

Ma page test est constituée d'un div centré horizontalement avec arriere-plan et une hauteur de 100% contenant 1 div à une hauteur de 100%.

Lorsque je redimensionne la fenêtre du navigateur et que j'utilise l'ascenseur pour faire défiler ma page l'arrière-plan (image ou couleur) n'est plus visible dans le reste de cette page.

Sous IE pas de probleme mais Firefox ou Opera.... ca marche pas..

voici le code CSS

	html, body {
	height: 100%;
	margin: 0;
	padding: 0;
	text-align: center; /* Alignement horizontal dans Internet Explorer */
	}
	#conteneur {
	margin: 0 auto;
	width: 750px;
	height: 100%;
	background-color: black;
	text-align:center;
	}
	#contenu {
	margin: 0 auto;
	text-align: left;
	width: 200px;
	height: 100%;
             }
	#contenu p {
	font-style:normal;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #FFFFFF;
	}


et le code html :



<body>
<div id="conteneur">
<div id="contenu"><p>svjnjkd djvkbsd vdjbvksdb jvkbdsvkj vdsjbvksdv vjdbskvs vdjvbks vdjvksv vjdksvbs
vbjdskvbsd vdjsbvksdv svbjkdsbvds vjkdsbvsd vkjsdbvsd vkjsv sdv sjkdvbjsd vsdjvbds vjds vsdjv jds vjksdvjsdbvsd vskvs
vdsbvksd vsd vsdjv sdk vj vsdjv sdj vdjsvbdsv dsv jds vjds vjksdvjsdvjsdv sdvjsdvjksdv skv jd vjsd vjsdv kjsd vsjdv s
vsdjklvsdjkv dskv sdk vsd vsjdkv dksvbsdkjv dsjbvsdjbdsbjsdbvds vds vkjsd vks</p>
 <p>svjnjkd djvkbsd vdjbvksdb jvkbdsvkj vdsjbvksdv vjdbskvs vdjvbks vdjvksv vjdksvbs vbjdskvbsd vdjsbvksdv svbjkdsbvds vjkdsbvsd vkjsdbvsd vkjsv sdv sjkdvbjsd vsdjvbds vjds vsdjv jds vjksdvjsdbvsd vskvs vdsbvksd vsd vsdjv sdk vj vsdjv sdj vdjsvbdsv dsv jds vjds vjksdvjsdvjsdv sdvjsdvjksdv skv jd vjsd vjsdv kjsd vsjdv s vsdjklvsdjkv dskv sdk vsd vsjdkv dksvbsdkjv dsjbvsdjbdsbjsdbvds vds vkjsd vks</p>
</div>
</div>
</body>



Merci de votre aide !
Salut

En donnant un height: 100% a ton #conteneur et #contenu tu limite sont hauteur a celle de ta fenêtre.

Et les bugs de IE font agrandir tes div

A+
Bonjour gege71,

merci de ta réponse, mais cela ne résoud pas mon problème...

le but est d'avoir un arriere-plan qui prenne toute la hauteur de la fenetre quelque soit sa taille, son redimensionnement, c pour ça que #conteneur qui contient l'arriere plan est height: 100%

Mais lorsque la fenetre est trop petite, et que l'on se sert des ascenseurs pour faire defiler la page, l'arriere plan se limite simplement à la partie visible de la page, et reste de la page n'a plus d'arriere plan.

j'espère que j'a
oups ! désolé dérapage sur le clavier...

enfin je disais j'espère que je suis plus clair.

Si vous avez d'autre solutions.... je suis preneur.

merci
Si, si, j’avais compris

En retirant height: 100% a ton #conteneur et #contenu, ton fond s’adaptera a la hauteur de ton contenu

Si tu veux forcer une hauteur mini il te faut
 
	_height: 100%;  /* pour IE */
	min-height: 100%; /* pour les autre */


A+
Ok je viens de comprendre !

effectivement tu as raison ca fonctionne mieux de cette façon.

Encore merci pour ta réponse !

A +