Fond d'ecran étirable & zone de texte lisible

Alors voila, bonsoir a tous ceux qui sont encore reveillés.

il y a un tuto sur les fonds d'ecrans étirables que j'ai suivi et ca marche.

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
}
#arriere {
	/* l'image occupe toute la place du body */
	width : 100%;
	height: 100%;
}

Le code HTML:

<img id="arriere" alt="" src="fonddecran1.jpg" />

Jusqu'a maintenant j'avais fait mes pages en utilisant la fonction background-image.

Seul bémol j'avais un cadre blanc placé a divers endroits avec du texte et maintenant, il ne s'affiche plus. Je dirai qu'ils sont en fait cachés par l'image qui vient par dessus.

Quelqu'un a t il une idée pour emettre une priorité sur l'affichage.

Cordialement.

Nicolas

Quand tu parle de fonds d'écran je supose que tu veux dire background de ta page
dans ce cas tu ne dois pas l'appliquer à une balise image mais plutôt au corp de ta page à savoir:

body {
margin: 0;
padding: 0;
background-image: url("fonddecran1.jpg"); 
  -webkit-background-size: 100% 100%; 
  -o-background-size: 100% 100%; 
  -moz-background-size: 100% 100%;
}

ou quelque chose comme ça...
Modifié par Omanu (08 Sep 2010 - 00:19)

as-tu pensé à la "tronche" du fond selon la taille, les proportions de l'écran de l'internaute qui va regarder le site ???
dans certains cas il va être totalement ddéformé ...