Background-image ne s'affiche pas dans un div

Résolu

Hébuus Messages postés 40 Statut Membre -
arthezius Messages postés 3756 Statut Membre - 23 févr. 2011 à 04:46

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 :)

Afficher la suite

2 réponses

Réponse 1 / 2
arthezius Messages postés 3756 Statut Membre 475
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> ?
0
1. Hébuus Messages postés 40 Statut Membre 3
  
  Oui, ca fonctionne bien avec les balises <img> , l'image s'affiche...
  
  0
2. __construct()
  
  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; }
  
  0
3. Hébuus Messages postés 40 Statut Membre 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 :(
  
  0
4. Hébuus Messages postés 40 Statut Membre 3
  
  Ah je vais essayer ca!!
  
  0
5. Hébuus Messages postés 40 Statut Membre 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 !
  
  0
Réponse 2 / 2
tito23 Messages postés 318 Statut Membre 4

Essai d'enlever la balise <img>
tito
0
1. Hébuus Messages postés 40 Statut Membre 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.
  
  0

Background-image ne s'affiche pas dans un div

2 réponses

Discussions similaires

Newsletters