Background-image ne s'affiche pas dans un div [Résolu/Fermé]

Signaler
Messages postés
38
Date d'inscription
mardi 22 février 2011
Statut
Membre
Dernière intervention
14 juillet 2012
-
Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
-
Bonjour,
je cherche à faire un cadre en css qui s'adapte a son contenu, j'ai trouvé la solution sur le net avec la methode des images : http://www.grainedekeupon.fr/ccm/bordure.html
Mais il y a un problème qui fais que je m'arrache les cheveux, mes background-image(s) ne veulent tout simplement pas s'afficher dans les <div>. En fait pour être sur de ne pas faire d'erreurs bêtes, j'ai repris un code tout simple avec un seul <div> et rien n'y fais ca ne s'affiche pas. Pourtant sur le "tuto" que j'ai trouvé il n'y a rien dis de particulier la dessus.

Voila le code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<title>Mon cadre</title>
		<link rel="stylesheet" type="text/css" href="styles/bordure.css">	
	</head>
	<body>
	
	<div class="top">
	 <p> le contenu ici et pour tester le chemin de l'image <img src="bords/bordure_top.png" alt="image utilisée en haut" title="image utilisée en haut"> </p>
	</div> 
	
	</body>
</html>


et voila le code CSS:
div.top{
background-image:url("bords/bordure_top.png"); 
background-repeat:repeat-x; 
background-position:top left;
}



Merci d'avance pour le temps que vous risquez d'y passer :)

2 réponses

Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
448
Tu peux simplifier ton CSS:
div.top{
	background:url(bords/bordure_top.png) repeat-x top left;
	}

Ton image s'affiche avec la balise <img></img> ?

Ta feuille de styles se trouvant dans le répertoire styles, il faut donc que tu lui indique le bon chemin de l'image qui se trouve dans le répertoire bords :
div.top{
background-image:url("../bords/bordure_top.png"); 
background-repeat:repeat-x; 
background-position:top left;
}
Messages postés
38
Date d'inscription
mardi 22 février 2011
Statut
Membre
Dernière intervention
14 juillet 2012
3
En fait même en copiant exactement le code source du petit tuto que j'ai link plus haut et en utilisant mes images ca ne fonctionne pas. je n'ai pas réussi a récupérer ces images et de toute façon je voulais un style different pour mon projet. Cela dit je ne pense pas que cela vienne des images parce qu'aucune image ne fonctionne j'en ai essayé plusieurs types. j'y ai passé la journée :(
Messages postés
38
Date d'inscription
mardi 22 février 2011
Statut
Membre
Dernière intervention
14 juillet 2012
3
Ah je vais essayer ca!!
Messages postés
38
Date d'inscription
mardi 22 février 2011
Statut
Membre
Dernière intervention
14 juillet 2012
3
C'étais bien ca, une histoire de chemin, quand je pense que ca m'a pris la journée! merci beaucoup en tout cas !
Messages postés
3538
Date d'inscription
jeudi 15 mai 2008
Statut
Membre
Dernière intervention
11 septembre 2016
448
Pas de souci, on est là pour ça ;)
Messages postés
305
Date d'inscription
mardi 10 août 2010
Statut
Membre
Dernière intervention
16 janvier 2013
4
Essai d'enlever la balise <img>
tito
Messages postés
38
Date d'inscription
mardi 22 février 2011
Statut
Membre
Dernière intervention
14 juillet 2012
3
mais la balise <img> dans le html ne sert qu'a verifier que je ne me suis pas trompé dans le chemin, le code html ne comporte pas cette balise en temps normal. ce qui m'embête c'est que je ne comprends pas pourquoi l'image de fond du <div> neveut pas s'afficher.